- From: Alan Gresley <alan@css-class.com>
- Date: Thu, 27 Jan 2011 05:15:39 +1100
- To: Anton Prowse <prowse@moonhenge.net>
- CC: www-style@w3.org, Niels Matthijs <niels.matthijs@internetarchitects.be>
On 27/01/2011 4:51 AM, Alan Gresley wrote:
> Anton,
>
> What happens if you have any element (container) with a width in pixels,
> ems, percent and one of the children is a float that has the width 100%.
> Any padding given to the element (container) would cause a horizontal
> scroll bar.
Sorry, I made a mistake. If the container is the <body> element, you
would have a horizontal scroll bar. The other example for a container is
like this.
<!DOCTYPE html>
<style type="text/css">
.container p { margin: 1em 3em }
.container h1 { margin: 1em 1.5em }
</style>
<div class="container" style="width: 800px; margin: 0 auto; border: 10px
solid blue;">
<div style="float:left; width: 100%; background: lime;">Float</div>
<h1>Heading</h1>
<p>text</p>
</div>
The only work around that I know of is to wrap the <h1> and <p> in
another element and apply the padding to it.
--
Alan http://css-class.com/
Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
Received on Wednesday, 26 January 2011 18:17:17 UTC