- This topic is empty.
August 8, 2012 at 9:04 am #39261
Hello all !
First of all, sorry for my bad english ;D
I have 3 div.
One serves to contain the other two, the code is below
margin: 20px auto 0 auto;
border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
the height is set to auto, because the content is variable and depends on the amount of text that is shown
the second is a bar to the title with fixed height of 50 px
border: 1px solid #cecece;
background: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#d3d3d3));
background: -moz-linear-gradient(top, #f6f6f6, #d3d3d3);
text-shadow: 0 -1px 0 white;
// multiple border
border: 1px solid white;
the problem is with the third, this also has variable height because it is the text container.
border: 1px solid #ced3d7;
why, if I put overflow: hidden; the container takes a height equal to 0? while putting overflow: hidden everything seems to work properly.
I hope for your helpAugust 8, 2012 at 9:36 am #107504
Could you put this on Codepen with your HTML?
If you float a div it will collapse unless you have set specific widths & height (I think) unless there is content in there.
Are these divs supposed to be stacked in a column? I’m having trouble visualising what it is you are trying to achieve.August 8, 2012 at 9:45 am #107505
http://codepen.io/anon/full/uECHx look at this
if you use overflow: hidden; the div “active-support-request” takes the correct height. Otherwise the height value is 52 (830px * 52), ie the height of the title bar
I’m new to the language of CSS, I know that the overflow is used to determine how it should behave the browser with the contents of a div, so I do not understand why it behaves this way.August 8, 2012 at 9:57 am #107509
OK, I took a guess in the meantime but here’s where I am: http://codepen.io/Paulie-D/pen/lAgvuAugust 8, 2012 at 10:05 am #107510
You really don’t have to define the height of a div as it will expand to fill the content within it. If you need some extra height for design reasons you can always add padding or (if you must) set a defined height.
If you set a fixed height that is LESS than the actual height needed to show all of the content and THEN set overflow hidden it will shrink the div to the height you have set and hide whatever is left over.August 8, 2012 at 10:38 am #107512
Oh i get it ! thank you :D
- The forum ‘CSS’ is closed to new topics and replies.