Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

<div> tag problems

Status
Not open for further replies.
Jimuniguy

Jimuniguy

Technical User
Mar 6, 2002
363
GB
I seem to have a massive problem with these, could someone explain what i am missing.

Idea
Want to place 3 60px x 60px boxs side by side with a 30px gap. All need to be relative.

My code
Code: 
<html>
<head>
</head>
<body>
<div id=&quot;Layer1&quot; style=&quot;position:relative; left:100px; top:25%; width:60px; height:60px; z-index:1; background-color: #999900; layer-background-color: #999900; border: 1px none #000000;&quot;>
<div id=&quot;Layer2&quot; style=&quot;position:relative; left:33px; width:60px; height:60px; z-index:2 background-color; background-color: #CC3366; layer-background-color: #CC3366; border: 1px none #000000;&quot;>
<div id=&quot;Layer3&quot; style=&quot;position:relative; left:33px; width:60px; height:60px; z-index:3 background-color; background-color: #99CC66; layer-background-color: #99CC66; border: 1px none #000000;&quot;></div>
</div>
</div>

</body>
</html>

Problem
The boxs all overlap!

Help please

Thank you

James
 
Sort by date Sort by votes
This worked for me:


<html>
<head>
</head>
<body>
<div id=&quot;Layer1&quot; style=&quot;position:relative; Left: 20px; width:60px; height:60px; z-index:1; background-color: #999900; layer-background-color: #999900; border: 1px none #000000;&quot;>
<div id=&quot;Layer2&quot; style=&quot;position:relative; Left: 110px; width:60px; height:60px; z-index:2 background-color; background-color: #CC3366; layer-background-color: #CC3366; border: 1px none #000000;&quot;>
<div id=&quot;Layer3&quot; style=&quot;position:relative; Left: 110px; width:60px; height:60px; z-index:3 background-color; background-color: #99CC66; layer-background-color: #99CC66; border: 1px none #000000;&quot;></div>
</div>
</div>

</body>
</html> ====================================
I love people. They taste just like
chicken!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

SitesMasstec
  • Locked
  • Question
Viewport meta tag x iframe
Replies
0
Views
146
SitesMasstec
SitesMasstec
tyutghf
  • Locked
  • Question
Slanted divs
Replies
0
Views
605
tyutghf
tyutghf
jason.lex
  • Locked
  • Question
crop image to fit in a div box?
Replies
2
Views
183
jason.lex
jason.lex
lupidol
  • Locked
  • Question
What does a question mark (?) stands for in ancho tag ? 1
Replies
2
Views
373
lupidol
lupidol
tyutghf
  • Locked
  • Question
Hide div on input focus
Replies
2
Views
120
tyutghf
tyutghf

Part and Inventory Search

Sponsor

Back
Top