html - Fix and flexible width divs next to each other -


I have 3 divs in the header. The width of the sides is fixed, but the center's div fills the remaining width.

It works on large screens, but under 630px, it does not work

HTML

  & lt; Div id = "header" & gt; & Lt; Div id = "content" & gt; CENTER & lt; / Div & gt; & Lt; div id = "left" & gt; LEFT & lt; / Div & gt; & Lt; div id = "right" & gt; Right & lt; / Div & gt; & Lt; / Div & gt;   

CSS

  #header {padding: 150px 0 250px; } # Left {status: relative; Swim left; Margin-left: -100%; Background: Red; Width: 250px; Correct: 250px; } #right {status: relative; Swim left; Margin-right: -100%; Width: 150px; Background: pink; } # Content {width: 100%; Background: green; Status: Relative; Swim left; }   

I spent hours with it to find this problem, but I do not know what is wrong. My Online Example

is available on i jsFiddle # left And # right have a relative position due to which they move to the next line when the width decreases below 630px.

Comments

Popular posts from this blog

php - PDO bindParam() fatal error -

logging - How can I log both the Request.InputStream and Response.OutputStream traffic in my ASP.NET MVC3 Application for specific Actions? -

java - Why my included JSP file won't get processed correctly? -