tags:

views:

132

answers:

3

i am trying it get that div displaying 5 in a row and then start a new line and display more

atm all that is happening is the are going under each other.

CODE

 < div>Line1< br />Line2< br>Line3< /div>

Thank you

A: 

A <br /> tag will always move to the beginning of the next line. So if you had this (I took the liberty to add a "/" to your second br tag, maybe this was the problem):

<div>Line1<br />Line2<br />Line3</div>

You'd get this:

Line1
Line2
Line3

Is that not what you want? If not, please clarify.

Jess
A: 

If you want the divs to display side-by-side you'll need to use css floats to do that.

<style type="text/css">
div { float: left }
</style>

Then, you'll need to use a <br clear="all" /> to move down to the next line.

This would mean that

<div>1</div><div>2</div><div>3</div><div>4</div><div>5</div>

Would show up as 12345 with the content all on the same line. Is this what you're looking for?

bradym
+1  A: 

If you want five divs side-by-side per line, the following works:

.cell { padding:0; margin:0; float:left; width:20%; }
.clear { clear:both; }

--

<div class="cell">1</div>
<div class="cell">2</div>
<div class="cell">3</div>
<div class="cell">4</div>
<div class="cell">5</div>
<div class="cell">6</div>
<div class="cell">7</div>

<div class="clear"></div>

For best results, all divs should have the same height. If they don't, you should place the <div class="clear"></div> after every 5th div.

Jonathan Sampson