Lining up CSS objects horizontally

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Lining up CSS objects horizontally

Post by Luke »

I can never get CSS to line up text next to an image or basically line up anything horizontally without using tables. If you aren't sure what I mean, look at my code:

Oh, and I know about float and I dont like it.

Code: Select all

<div class="main_body" align="left">
      <p><span><img src="images/spacer.gif" width="110" height="150" border="1" /></span>
             <span>asdfasda sd fasdf asdf</span> <-- This text should be lined up next to the image beside it but it shows up below.  -- />
     </div>
     <div class="main_body" align="left">
      <h1>Title</h1>
      <p>asdf ad</p>
     </div>
User avatar
andre_c
Forum Contributor
Posts: 412
Joined: Sun Feb 29, 2004 6:49 pm
Location: Salt Lake City, Utah

Re: Lining up CSS objects horizontally

Post by andre_c »

The Ninja Space Goat wrote:Oh, and I know about float and I dont like it.
why not?
In my opinion float solves the problem in a very clean way
foobar
Forum Regular
Posts: 613
Joined: Wed Sep 28, 2005 10:08 am

Re: Lining up CSS objects horizontally

Post by foobar »

andre_c wrote:
The Ninja Space Goat wrote:Oh, and I know about float and I dont like it.
why not?
In my opinion float solves the problem in a very clean way
I second that. It's a W3C approved way of dealing with your problem, if that makes it any better for you.
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Use float.... that's what it's for :) You need to combine it with clear as well most of the time to acheive expected results.

If you're having difficulty using the float attribute I'd have a browse around some articles on A List Apart : http://alistapart.com/
Ree
Forum Regular
Posts: 592
Joined: Fri Jun 10, 2005 1:43 am
Location: LT

Post by Ree »

You can check this as well: http://css.maxdesign.com.au/. Some nice tutorials there, especially float is very clean.
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Post by Luke »

my problem with float is that text starts at the bottom of the image... I will check out those links, hopefully there's a way to prevent that.
Post Reply