3 replies [Last post]
sanch3x
Offline
Enthusiast
Last seen: 13 years 18 weeks ago
Timezone: GMT-4
Joined: 2005-05-27
Posts: 223
Points: 2

Hello,

I'm finding myself in a situation described in the title. I have section headers (h4) where I need a part of the text aligned to the left and the other to the right. I tried the following:

h4 span.left-element { position: absolute; left: 0; width: 50%; }

h4 span.right-element {
position: absolute;
right: 0;
width: 50%;
text-align: right;
}

V&E - Leadership

Acceptable

...

I knew I'd get in trouble with the absolute positioning but I'm not quite sure how to pull this off without using a table. The h4 is overlapping the div that follows.

Just to let you know that I'm using the strict html 4.01 doctype and that my html is validating.

Thank you for any help.

Seb

"Don't worry about Blank let me worry about Blank"

Astigma
Astigma's picture
Offline
Regular
Ohio
Last seen: 13 years 17 weeks ago
Ohio
Timezone: GMT-4
Joined: 2007-05-03
Posts: 24
Points: 1

Instead of using absolute

Instead of using absolute positioning could you try floating the elements instead?

Maybe try:
h4 { float: left; width: 100%; }
h4 span.left-element { float: left; }
h4 span.right-element { float: right; }

The same html should work.
The problem with absolute positioning is you really need to consistently use it throughout the site. It's hard to use it once and have everything else look good. Hope that helps...

There is no problem which cannot be solved by a suitable application of high explosives.

sanch3x
Offline
Enthusiast
Last seen: 13 years 18 weeks ago
Timezone: GMT-4
Joined: 2005-05-27
Posts: 223
Points: 2

Thank you very much! It

Thank you very much!

It seems so simple now that you've said it haha! I only work with css during the summer break and even then I don't work with it extensively so every year I forget all these things! Thanks again Wink

Seb

"Don't worry about Blank let me worry about Blank"

thepineapplehead
thepineapplehead's picture
Offline
Moderator
Last seen: 41 weeks 3 days ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9683
Points: 819

Nice to see an old face back

Nice to see an old face back Wink

Verschwindende wrote:
  • CSS doesn't make pies