Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

How to fully span right-hand div, when left div is fixed size?

How to fully span right-hand div, when left div is fixed size?

Problem

I'm having two div layouted as inline-block. I want the left div to be of a fixed size and the right to fully span of what is left on the line - but never move to the next line. So, to divs on the same line. One is fixed, the other fully spans.

I prepared a JSFiddle, which is NOT what I intended, because the divs are on seperate lines. Any CSS-expert that did this before? http://jsfiddle.net/yT5Gc/1/

Problem courtesy of: feder

Solution

You could try the below:

HTML

div 1
div 2

CSS

#container { width: 100%; }
#div1 { width: 200px; float: left; border:1px solid; }
#div2 { border:1px solid; }

jsfiddle

Solution courtesy of: Thanassis_K

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

How to fully span right-hand div, when left div is fixed size?

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×