Re: Totally CSS?

#1

Osgood,

What does the -p represent in css-p?

Also, speaking of Div's or layers, in my experience, I have never been able to position a layer exactly where it is intended in various browsers, without anchoring it to some image. So, why all the buzz over using div's in your page structure over tables? To me, it just will not work. Unless, ofcourse, I am totally missing something.

#2

shelton:

Quote:

What does the -p represent in css-p?

p = positioning.

Visit the PVII site. Those <div> tags all appear exactly where intended.
http://www.projectseven.com/

Visit my recent sites -
http://www.reedtech.com
http://www.raphaelarchitects.com

Those <div> tags all appear exactly where intended.

Quote:

Unless, ofcourse, I am totally missing something.

I suppose you are missing something.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver MX
(If you *MUST* email me, don't LAUGH when you do so!)
==================
news://forums.macromedia.com/macromedia.dreamweaver - THE BEST WAY TO GET
ANSWERS
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.DreamweaverFAQ.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================

"shelton" <webforumsuser (AT) macromedia (DOT) com> wrote

Quote:

Osgood,

What does the -p represent in css-p?

Also, speaking of Div's or layers, in my experience, I have never been
able to position a layer exactly where it is intended in various browsers,

without anchoring it to some image. So, why all the buzz over using div's
in your page structure over tables? To me, it just will not work. Unless,
ofcourse, I am totally missing something.

Quote:

#3

"shelton" webforumsuser (AT) macromedia (DOT) com wrote:

Quote:

Osgood,

What does the -p represent in css-p?

P is for positioning. Its just a phrase which has been used to described
positioning elements by css.

Quote:

Also, speaking of Div's or layers, in my experience, I have never been
able to position a layer exactly where it is intended in various
browsers, without anchoring it to some image.

Well an absolutely positioned DW layer, which is really a <div> can be
placed exactly where you want on a page. You give it co-ordinates which
position it from the top left hand edge of the browser window. It will
remain in this position no matter what.

If you happen to have a combination of tables and layers on your page
then the layers appear to move. You must remember it is not the layers
that move it is the tables. Therfore if you want the layer positioned in
relationship to an image inside a table/cell you would have to move the
layer with some javascript. Snap Layers or Layout Designer 2 extentions,
from PV11, do this very nicely.

So, why all the buzz over using div's in your page structure over
tables? To me, it just will not work.

It does work, if you know what you are doing and there may be some
advantages to using them. Faster loading pages, cleaner structural
mark-up etc. Im not the one to ask really as I have my reservations
about its use. Well not its use, who will use it when its not supported
very well by major software programs. That doesnt mean its not any good
it just means it struggles to get a foot hold because the majority of
user are looking to use 'visual editors'. To my knowledge the programs
on the market at the moment do not render css-p good enough to be taken
seriously. That may change in the near future.

Unless, ofcourse, I am totally missing something.

I dont think you are necessarily missing the point, its just a
difficult one to get ones head around.

Quote:

#4

OhhhhhhK.... So I'm missing?

Maybe i was missing the fact that by using CSS you can surround static Div's with other floating Div's that have rules about their positioning which forces the static div's into a confined area?

#5

Quote:

Maybe i was missing the fact that by using CSS you can surround static Div's
with other floating Div's >that have rules about their positioning which forces

the static div's into a confined area?

I don't quite follow that, but I don't think you've got the idea. All divs are
static unless you tell them to be otherwise. They stay at the exact x, y, z
coordinates that you give them. All positioned divs (that is, divs that are
placed as "layers" on a page) are also positioned by css. All of them. There is
no other kind. So I've never really understood this argument against css-p,
since if you work with layers you automatically work w/ css-p. CSS-P just
implies that you put the styles in a style sheet or in the head of the document
rather than on the tag itself.

--
--
DiMa
--------------------
WEB FORUM USERS: Please log on to the Newsgroup for quicker replies to your
posts:
news://forums.macromedia.com/macromedia.dreamweaver
For Answers, check here first:
http://groups.google.com/advanced_group_search?q=+group:macromedia.dreamwea ver
http://www.macromedia.com/support/dreamweaver/technotes.html
http://www.projectseven.com/faqbase
http://www.dreamweaverFAQ.com

http://www.macromedia.com/support/forums/etiquette.htm
DiMa Design > From Lines...to Designs
http://www.dimadesign.net

"shelton" <webforumsuser (AT) macromedia (DOT) com> wrote

Quote:

OhhhhhhK.... So I'm missing?

#6

Dima,

You're right, I'm not completely getting it yet. But I am trying. I have been reading, so I'm not just sitting back being lazy looking for easy answers.

I guess I don't understand static vs. floating div's. I was thinking that static implied you gave the div an x and y coordinate -- therefore it is fixed. But... as I mentioned before, if you are using tables as well on the page, in different browsers, you get the appearance of the layer positioning differently - i guess because of the tables, as Osgood pointed out. ?? - i'm still not getting that.

So floating would imply that you position the layer via CSS #rules as opposed to x and y directly on the div tag?

What's your take on my remarks about attempting css-p on tables first, then making a progression toward layers over tables. I would imagine that it is quite difficult to lay out some designs completely via layers and css. I was looking at some recent sites I have built and was thinking what a nightmare it would be to try to make it work without any tables.

#7

Shelton:

I think this is how it goes -

An absolutely positioned page element is positioned at an absolute location
on your screen, regardless of its location in the flow of the code.

A relatively positioned page element is positioned relative to the position
of its container, regardless of its location in the flow of the code.

A statically positioned page element is positioned relative to its location
in the flow of the code.

Page elements that are NOT positioned are static.

Quote:

i guess because of the tables, as Osgood pointed out. ?? - i'm still not
getting that.

Page elements can move on the page if they have been RELATIVELY positioned,
e.g.,

<div align="center">This will move</div>

Absolutely positioned elements will NOT move on the page. If one moves and
the other doesn't then your brain says "hey - one of these has moved!".
That's all there is to it.

Quote:

So floating would imply that you position the layer via CSS #rules as
opposed to x and y directly on the div tag?

No. You can position page elements either by using inline styles (i.e., the
way DMX writes a 'layer'), or by using stylesheet styles (the way you might
do it if you were hand coding.

INLINE -

<div id="foo" style="position:absolute; top:140px; left:200px;
visibility:hidden; z-index:1">

STYLESHEET -
#foo { position:absolute; top:140px; left:200px; visibility:hidden;
z-index:1; }

....

<div id="foo>

Float refers to a sorta different effect which I am not going to discuss
further here.

Quote:

What's your take on my remarks about attempting css-p

How about this - make your pages the way you normally would and as your
understanding of CSS improves, introduce those new capabilities
incrementally.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver MX
(If you *MUST* email me, don't LAUGH when you do so!)
==================
news://forums.macromedia.com/macromedia.dreamweaver - THE BEST WAY TO GET
ANSWERS
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.DreamweaverFAQ.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================

"shelton" <webforumsuser (AT) macromedia (DOT) com> wrote

Quote:

Dima,

You're right, I'm not completely getting it yet. But I am trying. I have
been reading, so I'm not just sitting back being lazy looking for easy

answers.

Quote:

I guess I don't understand static vs. floating div's. I was thinking that
static implied you gave the div an x and y coordinate -- therefore it is

fixed. But... as I mentioned before, if you are using tables as well on
the page, in different browsers, you get the appearance of the layer
positioning differently - i guess because of the tables, as Osgood pointed
out. ?? - i'm still not getting that.

Quote:

So floating would imply that you position the layer via CSS #rules as
opposed to x and y directly on the div tag?

What's your take on my remarks about attempting css-p on tables first,
then making a progression toward layers over tables. I would imagine that

it is quite difficult to lay out some designs completely via layers and css.
I was looking at some recent sites I have built and was thinking what a
nightmare it would be to try to make it work without any tables.

Quote:

#8

position: absolute =
positioned absolutely - relative to the parent element (container).

position: relative =
positioned relative to its natural position in the document flow.

position: static =
positioned relative to the viewport (not supported in ie yet).

joe

"Murray *TMM*" <forums (AT) HAHAgreat-web-sights (DOT) com> wrote

Quote:

Shelton:

I think this is how it goes -

An absolutely positioned page element is positioned at an absolute
location
on your screen, regardless of its location in the flow of the code.

A relatively positioned page element is positioned relative to the
position
of its container, regardless of its location in the flow of the code.

A statically positioned page element is positioned relative to its
location
in the flow of the code.

Page elements that are NOT positioned are static.

i guess because of the tables, as Osgood pointed out. ?? - i'm still
not
getting that.

Page elements can move on the page if they have been RELATIVELY
positioned,
e.g.,

div align="center">This will move</div

Absolutely positioned elements will NOT move on the page. If one moves
and
the other doesn't then your brain says "hey - one of these has moved!".
That's all there is to it.

So floating would imply that you position the layer via CSS #rules as
opposed to x and y directly on the div tag?

No. You can position page elements either by using inline styles (i.e.,
the
way DMX writes a 'layer'), or by using stylesheet styles (the way you
might
do it if you were hand coding.

INLINE -

div id="foo" style="position:absolute; top:140px; left:200px;
visibility:hidden; z-index:1"

STYLESHEET -
#foo { position:absolute; top:140px; left:200px; visibility:hidden;
z-index:1; }

...

div id="foo

Float refers to a sorta different effect which I am not going to discuss
further here.

What's your take on my remarks about attempting css-p

How about this - make your pages the way you normally would and as your
understanding of CSS improves, introduce those new capabilities
incrementally.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver MX
(If you *MUST* email me, don't LAUGH when you do so!)
==================
news://forums.macromedia.com/macromedia.dreamweaver - THE BEST WAY TO GET
ANSWERS
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.DreamweaverFAQ.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================

"shelton" <webforumsuser (AT) macromedia (DOT) com> wrote in message
news:bf3g10$mcr$1 (AT) forums (DOT) macromedia.com...
Dima,

You're right, I'm not completely getting it yet. But I am trying. I
have
been reading, so I'm not just sitting back being lazy looking for easy
answers.

I guess I don't understand static vs. floating div's. I was thinking
that
static implied you gave the div an x and y coordinate -- therefore it is
fixed. But... as I mentioned before, if you are using tables as well on
the page, in different browsers, you get the appearance of the layer
positioning differently - i guess because of the tables, as Osgood pointed
out. ?? - i'm still not getting that.

So floating would imply that you position the layer via CSS #rules as
opposed to x and y directly on the div tag?

What's your take on my remarks about attempting css-p on tables first,
then making a progression toward layers over tables. I would imagine that
it is quite difficult to lay out some designs completely via layers and
css.
I was looking at some recent sites I have built and was thinking what a
nightmare it would be to try to make it work without any tables.

#9

On Wed, 16 Jul 2003 08:34:48 -0400, "Murray *TMM*"
<forums (AT) HAHAgreat-web-sights (DOT) com> wrote:

Quote:

An absolutely positioned page element is positioned at an absolute location
on your screen, regardless of its location in the flow of the code.

An absolutely positioned page element is positioned at an absolute
location relative to it's container.

Quote:

A relatively positioned page element is positioned relative to the position
of its container, regardless of its location in the flow of the code.

A relatively positioned page element is positioned relative to where
it would have been if it were a static element. It's location in the
flow of the code IS important in determining where it will be
positioned.

Gary

#10

I concur

--
--
DiMa
--------------------
WEB FORUM USERS: Please log on to the Newsgroup for quicker replies to your
posts:
news://forums.macromedia.com/macromedia.dreamweaver
For Answers, check here first:
http://groups.google.com/advanced_group_search?q=+group:macromedia.dreamwea ver
http://www.macromedia.com/support/dreamweaver/technotes.html
http://www.projectseven.com/faqbase
http://www.dreamweaverFAQ.com

http://www.macromedia.com/support/forums/etiquette.htm
DiMa Design > From Lines...to Designs
http://www.dimadesign.net

"Murray *TMM*" <forums (AT) HAHAgreat-web-sights (DOT) com> wrote

Quote:

Shelton:

I think this is how it goes -

An absolutely positioned page element is positioned at an absolute location
on your screen, regardless of its location in the flow of the code.

A relatively positioned page element is positioned relative to the position
of its container, regardless of its location in the flow of the code.

A statically positioned page element is positioned relative to its location
in the flow of the code.

Page elements that are NOT positioned are static.

i guess because of the tables, as Osgood pointed out. ?? - i'm still not
getting that.

Page elements can move on the page if they have been RELATIVELY positioned,
e.g.,

div align="center">This will move</div

Absolutely positioned elements will NOT move on the page. If one moves and
the other doesn't then your brain says "hey - one of these has moved!".
That's all there is to it.

So floating would imply that you position the layer via CSS #rules as
opposed to x and y directly on the div tag?

No. You can position page elements either by using inline styles (i.e., the
way DMX writes a 'layer'), or by using stylesheet styles (the way you might
do it if you were hand coding.

INLINE -

div id="foo" style="position:absolute; top:140px; left:200px;
visibility:hidden; z-index:1"

STYLESHEET -
#foo { position:absolute; top:140px; left:200px; visibility:hidden;
z-index:1; }

...

div id="foo

Float refers to a sorta different effect which I am not going to discuss
further here.

What's your take on my remarks about attempting css-p

How about this - make your pages the way you normally would and as your
understanding of CSS improves, introduce those new capabilities
incrementally.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver MX
(If you *MUST* email me, don't LAUGH when you do so!)
==================
news://forums.macromedia.com/macromedia.dreamweaver - THE BEST WAY TO GET
ANSWERS
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.DreamweaverFAQ.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================

"shelton" <webforumsuser (AT) macromedia (DOT) com> wrote in message
news:bf3g10$mcr$1 (AT) forums (DOT) macromedia.com...
Dima,

You're right, I'm not completely getting it yet. But I am trying. I have
been reading, so I'm not just sitting back being lazy looking for easy
answers.

I guess I don't understand static vs. floating div's. I was thinking that
static implied you gave the div an x and y coordinate -- therefore it is
fixed. But... as I mentioned before, if you are using tables as well on
the page, in different browsers, you get the appearance of the layer
positioning differently - i guess because of the tables, as Osgood pointed
out. ?? - i'm still not getting that.

So floating would imply that you position the layer via CSS #rules as
opposed to x and y directly on the div tag?

What's your take on my remarks about attempting css-p on tables first,
then making a progression toward layers over tables. I would imagine that
it is quite difficult to lay out some designs completely via layers and css.
I was looking at some recent sites I have built and was thinking what a
nightmare it would be to try to make it work without any tables.