Topic awaiting preservation: div layers (Page 1 of 1)

can somebody give me some resources that can help me understand the <div> tag a bit more. I tried on some css sites but nothing. Aside from alignment I've seen it used to create a layer kind of like a table, but I don't really know how it works.

Ew! Don't think of <divs> as layer creators. They're often used for layers, but that's not their purpose; that's merely what they're overused for.

A <div> tag is a block-level element (in other words, it causes there to be a line break above and below it, and behaves differently than inline text when CSS is applied to it, much like a <p> tag). It is used to specify a "section" of the page.

For instance, let's say I have a page with two main parts: a sidebar and a content area. I might structure the page like this:

<div class="sidebar">links</div>
<div class="content">headers and paragraphs of text</div>

The advantage to structuring the page like this is that I can then use CSS to make the sidebar behave differently than the content:

.sidebar {
float:right;
font-size:small;
}

.content {
font-size:medium;
}

Now, what you've probably seen divs for most is absolute positioning of elements. Divs are convenient in that they don't do anything to the text inside them by default, and I believe NN4 doesn't support absolute positioning of many other elements than divs. This is also done with CSS:

<div id="floatingthing">hi i'm wherever you want me to be</div>
...
#floatingthing {
position:absolute;
left:300px;
top:20px;
width:200px;
}

ok, I think I get it. do you have any examples that I can go to??

http://www.w3schools.com/css/

in the advanced part, can help a lot to begin....

Here is an excellent site that demonstrates the "proper" usage of <DIV>s that Slime described. http://www.glish.com/css/

I fly all my stuff around in <DIV>s. Here is a working example of just one way it can be done: http://www.bugimus.com/gurus/clickchaser.html

The reason I use <DIV>s for this is because it is left over from when NN4 was still a prominent browser. I wanted to be compatible and that was the only way, except for <LAYER>, to move things around the page.

But now if you only want to fly around one image you don't need to stick into a <DIV> to move it, you can just move the image itself. I don't have any examples of that coded up but will with newer projects.

. . : slicePuzzle