I have a div with an image and text inside. When I float the image so that the text is to the right of it the parent div, the height breaks and the image overflows.
See example: “Latest News” - House of Cards image
Why? Help.
Billy
http://www.smartytest.com/Sarah/
freewaytalk mailing list
email@hidden
Update your subscriptions at:
The outer box is not set to clear its children. You can force this by setting Overflow: hidden on the parent box. That forces the browser to consider floated children when it calculates the parent’s bounds.
Walter
On Jun 5, 2018, at 4:14 PM, billy kimmel email@hidden wrote:
I have a div with an image and text inside. When I float the image so that the text is to the right of it the parent div, the height breaks and the image overflows.
See example: “Latest News” - House of Cards imageWhy? Help.
Billy
http://www.smartytest.com/Sarah/
freewaytalk mailing list
email@hidden
Update your subscriptions at:
Information for existing FreewayTalk / Groups.io users - Site Feedback - Softpress Talk
freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options
CSS layout rules are complicated, and are designed to avoid difficult or impossible layout calculations rather than be logical and obvious to users.
According to 10.6.3 of the CSS 2.1 spec ("Block-level non-replaced elements in normal flow when ‘overflow’ computes to ‘visible’”):
"Only children in the normal flow are taken into account (i.e., floating boxes and absolutely positioned boxes are ignored… )”
(Freeway’s display is incorrect in this situation.)
There are different rules for absolute elements (layers).
If you set “overflow” to be “hidden” instead of “visible”, or use a layer parent, the height of the floating child will be taken into account.
Jeremy
freewaytalk mailing list
email@hidden
Update your subscriptions at:
Thanks Guys that worked.
Billy
freewaytalk mailing list
email@hidden
Update your subscriptions at: