Thu, 2007-05-03 13:17
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.
Thu, 2007-05-03 14:00
#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...
Thu, 2007-05-03 14:33
#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 
Thu, 2007-05-03 16:31
#3
Nice to see an old face back
Nice to see an old face back