CSS 3 Div Floats with Liquid center div -

-

it's quite simple question can't figure out what's wrong.

i have 3 divs, 2 of set pixel sizes , other (the middle) fills remaining space between two.

|------|--------------------------|------| |      |                          |      | |      |                          |      | |      |                          |      | |------|--------------------------|------|        <-------------------------->                  width fill

i have following css:

left div

#leftdiv {     height: 50px     width: 50px;     float: left;     }

middle div

#middlediv {     min-width: 270px;     width: calc(100% - 100px);     width: -moz-calc(100% - 100px);     width: -webkit-calc(100% - 100px);     width: -o-calc(100% - 100px);     float: left; }

right div

#rightdiv {     width: 100px;     height: 50px;     float: right; }

i've simplified here, right div doesn't float, goes underneath so:

|------|--------------------------| |      |                          | |      |                          |      |      |                          |       |------|--------------------------|                                 |------|                                 |      |                                 |      |                                 |      |                                 |------|

clear:both makes element drop below floated elements precede in document.

so try using clear: both in #rightdiv.

for more information, check so answer.


Comments

Post a Comment

Popular posts from this blog

c# - SelectList with Dictionary, add values to the Dictionary after it's assigned to SelectList -

-
i have following code - dictionary<string, string> mydict = new dictionary<string, string>(); mydict.add("keya", "valuea"); mydict.add("keyb", "valueb"); ienumerable<selectlistitem> myselectlist = new selectlist(mydict, "key", "value") further down in program, want add values mydict . possible? if yes, how? want - myselectlist.mydict.add("keyc", "valuec"); if you're wanting add items mydict, possible, , changes reflected in of myselectlist 's enumerations long changes made before enumeration (e.g. using .tolist() ) generated. as worked example: dictionary<string, string> mydict = new dictionary<string, string>(); mydict.add("keya", "valuea"); mydict.add("keyb", "valueb"); ienumerable<selectlistitem> myselectlist = new selectlist(mydict, "key", "value...
Read more

mysqli - Php Mysqli_fetch_assoc Error : "Warning: Illegal string offset 'name' in" -

-
this question has answer here: php mysqli returns 1 row 3 answers warning: illegal string offset 'name' in c:\xampp\htdocs\connection\index.php on line 31 1", please can me. <?php include('config.php'); $conn = mysqli_connect(db_host, db_user, db_pass, db_name); $sql = "select * users"; $result = mysqli_query($conn, $sql); $rows = mysqli_fetch_assoc($result); ?> and in body tag <?php foreach ($rows $row) { echo $row['name']; }?> you should use mysqli_fetch_all() here rows within $rows @ once. $sql = "select * users"; $result = mysqli_query($conn, $sql) or die(mysqli_error($conn); $rows = mysqli_fetch_all($result); echo "<pre>"; print_r($rows); // check result
Read more

javascript - Chart.js - setting tooltip z-index -

-
http://jsfiddle.net/gmannib/j2mwpj43/7/ ^ see sample fiddle above. notice how tooltips piechart go underneath "earth" icon have in middle there? there way set z-index property of tooltips above earth icon? thought work? race.tooltip.style.zindex = "5"; i'm still learning...thank kind help! just give higher z-index value canvas , done. see demo . css code canvas#race{position:relative; z-index:1;}
Read more