Stopping a div from moving to the next line

[myristate]

As you can see from the image the sentence is put onto a new line before the word "hard" and after it. This corresponds with the location of the <div> tags. So i am wondering how do i stop it from doing that. I have included the html and css if someone could help please.

 

 

HTML

   	<div class="raidlist_zonetitle">	
	Karagga's Palace (8 Man <div class="hard">Hard</div>)
</div>        
<div class="raidlist">
        <BR />
	Bonethrasher
        <BR />
	Foreman Crusher
        <BR />
	G4-B3 Heavy Fabricator
        <BR />
	Jarg and Sorno
        <BR />
	Karagga the Unyielding
        <BR />
        <BR />
	<BR />
</div>

 

 

CSS

.hard {
text-align: left;
color: #ff6633;
font-style: italic;
font-size: 1.0em;
}

 

[gizmola]

A div is by default a block element.  There are ways to override that but in this case, using a span instead of a div is the best solution. 

[myristate]

Thanks, that fixed it right up. I was always unsure of the span tag. But ive read up on it now. Thanks!

 

 

[sOLVED]

[Ivan Ivković]

To stop a div from moving to bottom, you can use float or display: inline. But span is better in this case.