html - Prevent equal height to dynamic width div from overlaping content below -


Anyone know how to overlap the content below, how can I prevent a similar height of dynamic width? In order to expand the content, Div has to be expanded.

@caeth has suggested moving down the div to be given inside the given device, which works: but I am looking for a solution that is not required.

Here is the code:

  & lt; Div class = "holder" & gt; & Lt; Div class = "size" & gt; & Lt; / Div & gt; & Lt; Div class = "shape_outer" & gt; & Lt; Div class = "shape_inner" & gt; Content ... & lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; div class = "size_blo" & gt; & Lt; / Div & gt;   

...

  .holler {display: inline-block; Status: Relative; Width: 50%; } .shape {margin-top: 100%; } .shape_outer {status: absolute; Top: 0; Bottom: 0; Left: 0; Correct: 0; } .shape_inner {background: #ddd; Minimum height: 100%; Width: 100%; } .shape_below {background: # 111; Width: 200px; Height: 200 pixels; }   

and a JSFiddle:

thanks b.

Try this:

  .shape {margin: 20px; }   

Creating a hidden field around the div what you are doing. I think you can remove size-exterior . / P>

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? -