html - Why won't my divs line up? -


here html

<!doctype html> <html>     <head>     <title>         oaki softworks     </title>     <link href='style.css' rel='stylesheet' type='text/css'>     <link rel="icon" href="favicon.png"> </head> <body>     <div id="navigation">         <div style="height:20px;width=15%;float:right;">             <a href="https://www.facebook.com/oakisoftworks/?fref=ts"><img src="facebook_icon.png" class="social_media_icon"></a>             <img src="instagram_icon.png" class="social_media_icon">             <img src="twitter_icon.png" class="social_media_icon">             <img src="youtube_icon.png" class="social_media_icon">         </div>         <div class="navigation_tile">contact us</div>         <div class="navigation_tile">careers</div>         <div class="navigation_tile">products</div>         <div class="navigation_tile">about us</div>     </div>     <div id="content">         <div id="blurb">             <img src="logo%20(inverted,%20transparent).png" style="width:90%;height:auto;align-self:center;">             <h2>video games art.</h2>             <p>even before conception of our company, have embraced video games newest, emerging art form. video games engage audience no other medium: allowing them digest material @ own pace, identify within avatar see fit, , interact world around them. oaki software aims underline these elements of art further our own game design.</p>         </div>         <div id="main_pic">             <img src="art.jpg">         </div>     </div>     <div id="footer">         <p>             oaki softworks&trade;             <br>fort collins, co 80521             <br>benkulka@oakisoftworks.com         </p>     </div> </body> </html>

here css

body {     background-color: #021034;     padding: 0px;     margin: 0px; }  #navigation {     position: fixed;     background-color: black;     height: 40px;     width: 100%;     color: white;     color: #adb7bd;     font-family: 'lucida sans', arial, sans-serif;     font-size: 16px;     line-height: 26px; }  div.navigation_tile {     height: 30px;     width: 15%;     align-content: center;     text-align: center;     float: right;     margin: 5px; }  div.navigation_tile:hover {     background-color: #092466;    }  div.navigation_tile:active {     background-color: white;     color: black; }  #content {     margin-top: 30px;     display: inline-block;     text-align: justify; }  #blurb{     padding: 40px 0 0 25px;     width: 28%;     height: 250px; }  #main_pic {     float: right;     width: 66%;     height: 250px;     border: 10px #092466 solid;     overflow: hidden; }  h1{     color: #a5b7e3;     font-family: 'lato', sans-serif;     font-size: 54px;     font-weight: 300;     line-height: 58px;     margin: 0 0 20px; }  h2 {     color: #6681c4;     font-family: 'lato', sans-serif;     font-size: 34px;     margin: 0 0 10px; }  p{     text-indent: 20px;     color: white;     font-size: 12px;     font-weight: 100;     font-family: 'lucida sans', arial, serif;     line-height: 20px; }  img.social_media_icon{     height: 15px;     width: 15px;     padding: 5px; }  #footer {     height: auto;     width: 100%;     background-color: black;     text-align: center;     padding: 5px; }

i'm trying #blurb div line #main_pic div within parent #content div, i'm having trouble doing so. can point me in right direction?

#blurb {     [...]     float: left; } #content {     [..]     overflow: hidden; }

also consider removing height: 250px; #blurb ... hard required reason.


-

Comments

Post a Comment

Popular posts from this blog

java - SSE Emitter : Manage timeouts and complete() -

i writing web app multiple listeners(evcentsource sse clients js) connected server . want store sse emitter per connected listener : can done in memory or other means assigning id each client able achieve far now question ; how send response/event specific client connected web app ? while doing sseemmiters stored either getting completed or timed out. how prevent ? how keep sseemmiter available open infinite time (till client closes) , send events selectively .
Read more

jquery - uncaught exception: DataTables Editor - remote hosting of code not allowed -

i'm trying implement crud operation using datatableseditor using datatables.but i'm getting error messages: 1)uncaught exception: datatables editor - remote hosting of code not allowed. please see http://editor.datatables.net details on how purchase editor license 2)typeerror: a.editor undefined 3) $.fn.datatable.editor not constructor" what reason? here configuration: <%@ page language="java" contenttype="text/html; charset=iso-8859-1" pageencoding="iso-8859-1"%> <!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <title>insert title here</title> <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.12/css/jquery.datatables.min.css"> <link re...
Read more

java - How to resolve error - package com.squareup.okhttp3 doesn't exist? -

i trying convert json java object use of gson in maven, following youtube video guidance - https://www.youtube.com/watch?v=vqgghm9pwe0 , theres error occurs when in main class error - package com.squareup.okhttp3 doesn't exist. code below: java package com.codebeasty.json; import com.squareup.okhttp3.okhttpclient; public class main { private static okhttpclient client = new okhttpclient(); public static void main (string [] args) { } } i put in dependency in pom.xml: <dependencies> <dependency> <groupid>com.squareup.okhttp3</groupid> <artifactid>okhttp</artifactid> <version>3.4.2</version> </dependency> <dependency> <groupid>com.google.code.gson</groupid> <artifactid>gson</artifactid> <version>2.8.0</version> </dependency> </dependencies> i dont understand why doesn't recognize com.squareup. there may need download? have downl...
Read more