On Jan 1, 2014, at 3:43 AM, Alan Gresley <a...@css-class.com> wrote:
Thank you for shedding light Alan..as soon as I read your corrections, I
realized that I hadn’t removed floats (d’oh!) but had no idea bout the margin %
becoming part of the width of the float…
> When you use percentage margins, they become part of the width of the float
> (margin box). If the float is floating right, only the margin-right has any
> effect. The margin-left is eaten by the hidden overflow (outside the viewport
> on the left).
Why so? I thought it was Padding that added to width, ie, if:
padding-right:10px, subtract 10px from width to maintain overall width (that
the eye sees). Isn’t margin the value that *moves* the entire div?
> This margin-right: 3% is the percentage that the float is overflowing the
> viewport into hidden overflow. Remove the float for the <aside> and change
> these following values.
>
> aside{
> width:100%;
> float: none; /* ADD */
> margin: 8% auto 0 3%; /* CHANGE */
> border: 1px solid white;
> }
>
> Even this approach will bring unexpected results.
Why so? What about this will be unexpected?
John
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
