Re: Unwanted red line, margins, bottom page margin, em sizes bad, menu item grouping
- From: "Chris F.A. Johnson" <cfajohnson@xxxxxxxxx>
- Date: Sat, 5 Aug 2006 19:51:33 -0400
On 2006-08-05, Edward wrote:
I created a simple CSS layout (code and example below) for
bloggin/writing but ran into five issues that I need help with:
Is this what you want:
<http://cfaj.freeshell.org/web/examples/layoutRightBoxes/>
View the source at:
<http://cfaj.freeshell.org/web/examples/layoutRightBoxes/index.txt>
1. How do I get rid of the right-margin red line on the last three
right-boxes in Internet Explorer?
Don't put them inside a div with a red background, and/or, specify
the proper width (or none at all).
2. How can I put a 4px margin BETWEEN the right-boxes, "border-top:
4px" didn't do it and if I put in a "margin-top: 4px;" it shows the red
underneath instead of the brown background graphic.
Don't put them inside a div with a red background, and "margin-top:
4px;" will work.
3. How can put a 10px margin on the BOTTOM of the main area so that it
isn't flush with the bottom of the browser so it looks more like a
piece of paper lying on a desk? "margin-bottom: 10px;" in #main doesn't
do it.
Add a div with "clear: both" at the bottom.
4. I always read to "use em for fonts" but when I change the font to em
in this main DIV, then the em fonts in my right-boxes change
accordingly, which is undesirable since I should be able to change the
size of one part of the page without having to go change all my other
font sizes.
Style the entire <body> as "font-size: 1em;". Adjust all others
relative to that. For example, the menu might be:
"font-size: .85em;". Always leave the main text at 1em.
So I don't use em font sizes but pt sizes so I can easily
determine what sizes the fonts are (especially if you have graphics
which don't change sizes) and in Firefox you can increase the size of
the pt fonts anyway and I'm sure its possible in Explorer too if you
search around enough.
Why do you insist on making life difficult for your viewers?
5. How can I get my menu items that are two lines to group together
closely to so that they are easier to read?
ul.menu li {
padding: .5em 0;
}
--
Chris F.A. Johnson <http://cfaj.freeshell.org>
===================================================================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
.
- Prev by Date: Re: zero size DIV in IE6
- Next by Date: Re: best of both worlds: CSS and table layouting?
- Previous by thread: apply multiple classes
- Next by thread: Re: best of both worlds: CSS and table layouting?
- Index(es):
Relevant Pages
|