Re: auto units versus 'auto' value, was Re: vertical-align

> That is because {margin:auto} is equivalent to
> {margin-left:auto;
>  margin-right:auto;
>  margin-top:auto;
>  margin-bottom:auto}

Right,  you may also use 100%% instead of auto;

so if you have two divs placed as

<div >...</div>
<div >...</div>

Vertical space between their borders will be 1/3 of container height.
Vertical distance from their borders and inner box of container will be also
1/3.

(vertical margins are overlaping, and %% also use this rule)

>
> Your method is:
>
> 1. Determine the amount of free space
> 2  Multiply the amount from step 1 by 30.
> 3. Determine the sum of the %%'s
> 4. Determine the greater of 100 and the amount from step 3.
> 5  Divide the amount from step 2 by the amount from step 4.
>

Exactly!

So:

<p><span width=30%% /></p>
<p><span width=30%% /><span width=60%% /></p>

in both cases width of first span will be the same. And we will have empty
non distributed free space.

we have not any problem with the "over-constrained" in this case. Right?

And let's take a look here:

<DIV style="width:30%%">...</DIV>

Three choices:
1) If nothing else given may be treated as: this block is getting
display:inline-block style.
2) If display:block then total sum of all %% is used for width computing.
Not max(total,100).
3) Use the same approach as like any other fixed value set for this block
width - use "carriage return" after.

Comment about case 1) : If we would have established %% from the very
beginning we will not need display:block and display:inline-block now.
block having width = 100%% - occupies all given container width. and
inline-block - does not. Simple and universal brickwork layout rule for any
container.

Andrew Fedoniouk.
http://terrainformatica.com

Received on Friday, 21 May 2004 20:31:20 UTC