align div

liunx

Guest
Hi !!!
My question is not so simple...
I have 5 div I want to align them all on the same level without using absolute positioning...
But, if I give them relative positioning, they will stack upon each other like that :
div 1
div 2
div 3
div 4
div 5

I want them separated from each other, and on the same vertical level, but I can't use the absolute positioning ( otherwise, it would be too easy... )

Anyone has an idea ???
It would be great...
thanks !!

Oh, I forgot to mention :
they should be like :
div 1 div 2 div3 div 4 div 5, but on the left the spacing has to start 277px from the left, and on the right, it should end 130px from the right...
I tried with margins and padding and all, but I can never get everything working at the same time...Drop it, I've done it with images...
I'm still curious to know if it's possible to align div on the same vertical level, without using absolute positioning, and without having to set negative top-margins...<html>
<head>
<title>blah</title>
<style>
.g1 {background-color:#336699; width:50px;}
.g2 {background-color:#339966; width:50px;}
.g3 {background-color:#996633; width:50px;}
.g4 {background-color:#993366; width:50px;}
.g5 {background-color:#663399; width:50px;}
.g6 {text-indent:277px;}
</style>
</head>

<body>
<!-- Div wants to make a new line each time, like a <br> -->
<div class="g1"></div>
<div class="g2"></div>
<div class="g3"></div>
<div class="g4"></div>
<div class="g5"></div>
<br>

<!-- Span will stay inside the div mostly -->
<div class="g6">
<span class="g1"></span>
<span class="g2"></span>
<span class="g3"></span>
<span class="g4"></span>
<span class="g5"></span>
</div>

</body>
</html>

It seems like what you want is a span tag
This code would push those in 277px and give you an idea of why they dont place right in a line without spacing attached to fix it.

edit: k guess you solved itqzn, that's exactly what I was looking for...
but, your spans don't work if you don't have any text in it... :(
I had to edit the page and add text between the span tags to make it work...
do you know why ???
 
Back
Top