juliann wheeler wrote:
I have a page that was previously created with tables www.ironies.com .
Recently, I have re-created the entire page using css for the first
time. You can see it at www.ironies.com/new.htm .
I'm having problems with the positioning when I view from different
browsers.
In Firefox, the logo on the top right gets pushed down and imposes on
the image below it.
This is because you have placed the image in a p, and you have set all
p's to have top margins of 1em. FF is obeying you. Strip out the p
(you've already placed it in a div, so the p is unnecessary) and the
image should move up.
I would not suggest making the logo a background image, because it is
not decoration, it is content. I would suggest giving it an alt
attribute of "Ironies" so that search engines and people using assistive
technology will know what it says.
In Explorer, there is a white space behind the light brown bar at the
bottom where the background color doesn't show up for some reason.
I see a white gap at its right edge in both IE and FF.
I would suggest rebuilding your layout in a more efficient way to avoid
these problems. In general, there is no need to create empty divs just
to create blocks of color. To create that empty block of brown, I'd
simply create a gif that was 979px wide (your current page width, which
doesn't fit in 800x600, so you may want to make your page more narrow,
btw) by 10px tall, and fill it with that brown. Set this image as a
background on the body and tell it to repeat-y (that it, only repeat
downwards. Also set the background color to #fff, and you've got your
brown filling up the space beneath your layout with white filling up the
space to the right.
When designing with CSS, you'll have the most luck if you think about
the structure of your page without any dressing on it first. Divide it
into logical sections using div elements. Mark up the content within
these sections with the appropriate semantic elements. Make sure it
makes sense in a text browser. Once you have a solid structure, it's
much easier to hang a robust style on it. It's definititely a different
way of thinking about your pages and doing things, but once you get into
the CSS mindset, it's hard to go back to tables. Trust me. I'm a table
layout idiot now. :-)
In safari I have both problems at once.
Can't help you with Safari, but if you read up more on creating layouts
with CSS and restructure your page accordingly, I bet most of your
problems will disappear.
Good luck,
Zoe
--
Zoe M. Gillenwater
Design Specialist
UNC Highway Safety Research Center
http://www.hsrc.unc.edu
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
