aligning images

[feblioz]

<div id="user-bar">
<div id="user-options">
<div class="notification-container">
<img src="media/gear-faded.png">
</div>

<div class="notification-container">
<img src="media/courses-faded.png">
</div>

<div class="notification-container">
<img src="media/chat-faded.png">
</div>
</div>

<span class="profile-container">
<img src="https://openlearning-cdn.s3.amazonaws.com/feblioz-avatar-24-ts1330811171.jpg" alt="" border="0" class="profile-image" align="absmiddle" width="24" height="24" id="myAvatar24">
<span>feblioz</span>
</span>
</div>

anyone knows how to make all the images to be in one line? the images are all pretty small.

[hericles]

If you need each image to be in a div give the divs a CSS class that they share. For that CSS class set

display: inline-block;

This will your divs, and the images inside them, along the same line. Block level elements such as divs do not line up beside each other but stack down the page. Using display:line-block tells the divs to stop that and line up across the page.

[simplypixie]

Or float the image class to the left