9 replies to this topic

[digitalbeef]

I would like some help with tags nested within the <div> tag that are overlapping one another. Can you nest more than one tag within <div>? This happens once I try to render the page no matter which browser I use.

<div style="height:320px; width:500px; position:absolute; top:100px; left:100px;"


<h2>Welcome to GeekJunkie, your online geek source.</h2>


<p>What do we have to offer? </p>


  <ul>

    <li>Gaming</li>

    <li>Software</li>

    <li>Music</li>

    <li>Video</li>

    <li>News</li>

    <li>Updates</li>

    <li>Tutorials</li>

    <li>Source code </li>

    <li>And much more</li>

  </ul>


<p>We are launching our online forum (a great way to network with others) this 

summer! Make sure you register to get all of GeekJunkie's updates and news.</p>


</div>

[so1i]

I'm a bit stuck on what you mean, but yeah, you can enclose as many tags as you like within <div> tags, including more <div> tags. It's just a way of laying things out.

You are missing the '>' from your opening <div> tag, that could be causing you the problem. When I try the code it seems to be fine! :)

EDIT: If you are talking about 'Nesting' tags, then Div tags should be properly nested. They can't 'overlap', the first <div> tag will end with the last </div> tag, etc. Not sure if that is what you meant either, but that's just an aside anyway! :)

[digitalbeef]

Sorry, but what I was saying is that anything nested within the div tag seems to overlap one another. For example, if I place paragraph and a header within it, for some reason they appear within the same spot of one another.

[so1i]

digitalbeef said:

Sorry, but what I was saying is that anything nested within the div tag seems to overlap one another. For example, if I place paragraph and a header within it, for some reason they appear within the same spot of one another.

Hm, for me that code appears fine. What browser are you using?

You should be able to nest tags just as you have done above.

[digitalbeef]

I've been using IE, Firefox, and Safari but to no avail. Guess I'll figure it out.

[DarkLordoftheMonkeys]

I can't tell exactly what you're trying to do, but if you want to overlap divs and keep them inside another div tag, you should use relative positioning, not absolute positioning. An absolutely positioned element placed 100px down and 100px right will always be in the top left corner of the page, regardless of what div contains it.

[so1i]

I'm confused too. What is appearing wrong with the above code? There are no 'overlaps' for me. In the code, or in the formatted result of the code - or not as far as I can tell.

[jclarke]

are you guys, talking about overlapping a image with another (for example) ?

[Orjan]

no, an div with another div

[technica]

you can surly do this. but then for positioning you will have to give certain properties to each div through css.

For each inner div you will need to give "position:relative;" property through the css.

try using it, it may help you.