Question

I have added div tags to text on the same line as I wanted to add the mouseover feature but now all the text is on different lines. How do I make it so all the text is on the same line?

HTML:

<div style="margin-top:30px;" />
<center>
<table height="50" width="400" cellpadding="0" cellspacing="0">
<tr>
<td>
<center>

<hr size="1" color="#585858" width="82%"></hr>

</center>
<center>
<div class="about">
<font face="helvetica" size="2" color="#585858">About Us</div>
&nbsp;&nbsp;&nbsp;<div class="about">Accessibility</div>
&nbsp;&nbsp;&nbsp;<div class="about">Contact Us</div>&nbsp;&nbsp;&nbsp;</font></div>

<font face="helvetica" size="2" color="#585858">&copy;2011&nbsp;-&nbsp;Privacy
</font></center>


</center>
</td>
</tr>
</table>
</center>

CSS:

.about:hover {
font: 13px helvetica;
text-decoration: underline;
}

Thanks!

James

Answer 1

Write float:left or display:inline-block in the div css because div is a block element that’s why it comes below each other. So; that’s why we use float & inline-block to force the div takes it’s actual width:

div{
 float:left;
}