CSS positioning : relative, fixed, absolute and liquid layouts
 

Please note that I have re-checked all my sources, and checked the
Internet, and either I have missed something or I have misunderstood.
Which is why I am asking.

My question is:
Can you have <div> tags in your physical html file in a specific order
(for example,
<div id="one"><p>This is div one</p></div>
<div id="two"><p>This is div two</p></div>
<div id="three"><p>This is div three</p></div>
)

yet on screen display them in a different order (eg, 3, 2, 1), with a
fluid/liquid layout, so that on browser resizing, all items are still
displayed, even though the user may need to scroll vertically?

As far as I can tell, absolute positioning reduces fluidity?

Any helpful hints, comments or suggestions would be appreciated.
Thanks,

Kat

Re: CSS positioning : relative, fixed, absolute and liquid layouts
 

On Mon, 14 Feb 2005 14:33:01 +1030 KatB wrote:


> Please note that I have re-checked all my sources, and checked the
> Internet, and either I have missed something or I have misunderstood.
> Which is why I am asking.

> My question is:
> Can you have <div> tags in your physical html file in a specific order
> (for example,
> <div id="one"><p>This is div one</p></div>
> <div id="two"><p>This is div two</p></div>
> <div id="three"><p>This is div three</p></div>
> )

> yet on screen display them in a different order (eg, 3, 2, 1), with a
> fluid/liquid layout, so that on browser resizing, all items are still
> displayed, even though the user may need to scroll vertically?

> As far as I can tell, absolute positioning reduces fluidity?

> Any helpful hints, comments or suggestions would be appreciated.
> Thanks,

> Kat


Float:left will order the divisions as "1.........2........3" while
float:right will order them as "3.........2........1".
All you have to do is THINK how it's going to look on the screen.

Re: CSS positioning : relative, fixed, absolute and liquid layouts
 

That's an interesting development.

Are the DIV's the result of a PhP output?

Have you tried,

<P><div id="one">This is div one</div></p>
<P><div id="two">This is div two</div></p>
<P><div id="three">This is div three</div></p>

I know it looks strange, but I am a noob to this stuff too.

Hope this help!

Erik
http://www.downloadcrazy.com


"KatB" <kat@t-tec.notthis.com.au> wrote in message
news:1108353295.418114@teuthos...
>
> Please note that I have re-checked all my sources, and checked the
> Internet, and either I have missed something or I have misunderstood.
> Which is why I am asking.
>
> My question is:
> Can you have <div> tags in your physical html file in a specific order
> (for example,
> <div id="one"><p>This is div one</p></div>
> <div id="two"><p>This is div two</p></div>
> <div id="three"><p>This is div three</p></div>
> )
>
> yet on screen display them in a different order (eg, 3, 2, 1), with a
> fluid/liquid layout, so that on browser resizing, all items are still
> displayed, even though the user may need to scroll vertically?
>
> As far as I can tell, absolute positioning reduces fluidity?
>
> Any helpful hints, comments or suggestions would be appreciated.
> Thanks,
>
> Kat

Re: CSS positioning : relative, fixed, absolute and liquid layouts
 

"Richard" <Anonymous@127.001> wrote
> On Mon, 14 Feb 2005 14:33:01 +1030 KatB wrote:

> Float:left will order the divisions as "1.........2........3" while
> float:right will order them as "3.........2........1".

Where did the OP state that the divs were to appear *across* the page?

> All you have to do is THINK <snip>

Re: CSS positioning : relative, fixed, absolute and liquid layouts
 

"KatB" <kat@t-tec.notthis.com.au> wrote

> My question is:
> Can you have <div> tags in your physical html file in a specific order
> (for example,
> <div id="one"><p>This is div one</p></div>
> <div id="two"><p>This is div two</p></div>
> <div id="three"><p>This is div three</p></div>
> )
>
> yet on screen display them in a different order (eg, 3, 2, 1), with a
> fluid/liquid layout, so that on browser resizing, all items are still
> displayed, even though the user may need to scroll vertically?

I assume you want these to be arranged vertically on the page.

Can't be done. You can position div 3 at the top of the page with absolute
positoning and you can position div 2 after that (the start of div 3 that
is) but you cannot position div 2 *at the end* of div 3. You don't know
where div 3 ends.

Why would you want to do this?

--
Cheers
Richard.

Re: CSS positioning : relative, fixed, absolute and liquid layouts
 

>> My question is:
>> Can you have <div> tags in your physical html file in a specific order
>> (for example,
>> <div id="one"><p>This is div one</p></div>
>> <div id="two"><p>This is div two</p></div>
>> <div id="three"><p>This is div three</p></div>
>> )
>>
>> yet on screen display them in a different order (eg, 3, 2, 1), with a
>> fluid/liquid layout, so that on browser resizing, all items are still
>> displayed, even though the user may need to scroll vertically?

AFAIK no. What is the underlying problem? Probably there are other, more
suitable ways of solving it.

> Have you tried,
>
> <P><div id="one">This is div one</div></p>
> <P><div id="two">This is div two</div></p>
> <P><div id="three">This is div three</div></p>
>
> I know it looks strange, but I am a noob to this stuff too.

No offence, but one can tell :)
Not only could this in no way help with OP's question, it is also
incorrect. A paragraph can't containt block-level elements, e.g. divs.

Also, please don't top-post.

Re: CSS positioning : relative, fixed, absolute and liquid layouts
 

On Mon, 14 Feb 2005 14:33:01 +1030, KatB <kat@t-tec.notthis.com.au>
wrote:

>Can you have <div> tags in your physical html file in a specific order
>yet on screen display them in a different order (eg, 3, 2, 1), with a
>fluid/liquid layout,

No. If you want real fluidity to work well, the order in the document
is significant.

Re: CSS positioning : relative, fixed, absolute and liquid layouts
 

rf wrote:
> "KatB" <kat@t-tec.notthis.com.au> wrote
>
>
>>My question is:
>>Can you have <div> tags in your physical html file in a specific order
>> (for example,
>> <div id="one"><p>This is div one</p></div>
>> <div id="two"><p>This is div two</p></div>
>> <div id="three"><p>This is div three</p></div>
>> )
>>
>>yet on screen display them in a different order (eg, 3, 2, 1), with a
>>fluid/liquid layout, so that on browser resizing, all items are still
>>displayed, even though the user may need to scroll vertically?
>
>
> I assume you want these to be arranged vertically on the page.
>
> Can't be done. You can position div 3 at the top of the page with absolute
> positoning and you can position div 2 after that (the start of div 3 that
> is) but you cannot position div 2 *at the end* of div 3. You don't know
> where div 3 ends.
>
> Why would you want to do this?
>

Thank you for replying.

I was reading about search engine optimisation, and it was suggested
that having the actual content closer to the opening body element(tag)
would be beneficial.

So I thought maybe I could have the content listed first, then the
navigation, and at last, the logo, and use CSS to rearrange it.

Instead I will minimise the logo and the navigation to bear bones
essentials.

Again, Thank you:)

Kat

Re: CSS positioning : relative, fixed, absolute and liquid layouts
 

"KatB" <kat@notthis.com.au> wrote

> I was reading about search engine optimisation, and it was suggested
> that having the actual content closer to the opening body element(tag)
> would be beneficial.

Ah, thought this might have been what you were after.

I really don't think it makes any difference. The SE's bot is going to read
all of the text anyway.

Probably of more importance is to use the correct elements to mark up your
content. For example a bot will pay more attention to your headings if they
are inside a <Hn> element rather than a styled <div>.

> So I thought maybe I could have the content listed first, then the
> navigation, and at last, the logo, and use CSS to rearrange it.

> Instead I will minimise the logo and the navigation to bear bones
> essentials.

I would think you should do this anyway.

The most important viewer of your page is your human viewer. You have eight
to eleven seconds to grab her attention enough to stay on the page.

A huge logo or navigation scheme at the top of the page is not going to do
that. Some worthwhile content is :-)