On Mon, 26 Feb 2007, Martha H. Bowes, CLTC wrote:
> Now that my page is centered in the browser
> windows, how can I color the outside margins. I think I want the
> center to stay white - -
Sorry, I don't quite follow... the content now has yellow background and
the margins are white, as you have set in your style sheet:
BODY {
text-align: center;
background-color: #FFFFFF;
- -
}
table {margin: 0 auto; text-align: left; background color: #FFFFCC;}
Actually the latter has syntax error but IE incorrectly guesses that you
meant background-color. After fixing this, you can set the colors as
desired - perhaps you meant swapping #FFFFFF and #FFFFFFCC? But perhaps
you could keep using yellow background for the content and change the BODY
background (i.e., the color of the margins for the content) to some darker
shade of yellow.
> Also, the style code for the footnotes isn't working in IE 7 as it
> should (or at least, as I'd like it to), with a serif font:
>
> sce {
> color: #999999;
> font-size: 75%;
> font-weight: bold;
> font-family: Times New Roman, Times, serif;
> }
The problem is that you cannot add new elements to HTML (like you could in
XML). Use a class instead, e.g.
<p class="sce">...</p>
with
.sce { ... }
(note the leading period).
Font reduction to 75%, combined with bolding, gray color, and serif font
could easily make the text unreadable to a large number of users. I'd
suggest just something like
.sce { font-size: 83%; font-family: Times New Roman, Times, serif; }
> Another thing I notice is the link menu has too much space between
> the lines and text in IE 7 compared to Safari.
That's a tougher question. I think the problem is that in the menu, the
images appear technically inside text along with <a> elements. The browser
may then format it as if the images were letters of odd shape. For some
reason, IE thinks that the line length of a line containing just an image
needs to be the same as for text in general. Adding <br> after each <img>
might change this, but if you would have to change the markup on all pages
anyway, you might just as well consider using a different approach that
makes more consistent styling possible. After designing the menu afresh,
you could copy and paste its code, so it would not take too much space.
The general idea is that a menu is best written as a simple list of links,
a <ul> element with nothing but <a> elements inside its <li> children, and
then you can start styling it. You might not get the style right the first
time, but it would be easy to modify it, since all rendering issues would
be centralized in a few CSS rules in one file. You can, among other
things, create horizontal lines by setting bottom borders for elements, so
there is no need to resort to images for that.
--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/