5 replies [Last post]
ncpilgrim
ncpilgrim's picture
Offline
newbie
Last seen: 14 years 13 weeks ago
Joined: 2007-08-05
Posts: 10
Points: 0

Hi smart folks!

I have a few pieces of text that need to appear on the same line. The first element needs to be aligned left, the next near the center, and a few nav elements aligned right. I prefer not use a table to layout this section. I tell ya, I have tried and experimented, and I have done my share of searching, but to no avail. Can someone send me in teh right direction?

Thanks!

Triumph (not verified)
Anonymous's picture
Guru

Show us what you have now.

Show us what you have now. Smile

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 7 years 7 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Make the container for all

Make the container for all three text-align: center. Then wrap the left and right bits in an element (as Triumph says, we'd need to see what you've got now to suggest which elements), float the left one left and float the right one right. The floated elements need to come first in the source, ie, before the content that is to be centered.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

ncpilgrim
ncpilgrim's picture
Offline
newbie
Last seen: 14 years 13 weeks ago
Joined: 2007-08-05
Posts: 10
Points: 0

Line seems to be splitting...

First of all, thanks. What seems to be happening is the span without the align property (not floated) is properly centered, but the floated-left and floated-right spans appear on the next line, though properly aligned to the left and right respectively:



Welcome Paul
Menu Placeholder
Application: xxxx




...and here's the stylesheet:

#appHeader
{

background-color: #99FFFF;
font-family:Arial, Helvetica, sans-serif;
margin-left: 10px;
margin-bottom: 10px;
text-align:center;
font-size:small;

}
#appName
{

float:left;

}
#appWelcome
{

}
#appHeaderMenu
{

float: right;
}

What do you think?

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 7 years 7 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Tyssen wrote:The floated

Tyssen wrote:
The floated elements need to come first in the source, ie, before the content that is to be centered.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

ncpilgrim
ncpilgrim's picture
Offline
newbie
Last seen: 14 years 13 weeks ago
Joined: 2007-08-05
Posts: 10
Points: 0

In honor of the Simpsons movie...

Doh!

Problem solved. Thanks. I am still getting yse to the float concept!