On Sep 23, 2007, at 9:49 AM, Don Hinshaw wrote:

> http://dime77.dizinc.com/~somedom/geothermex/about-us.html
> CSS here: http://dime77.dizinc.com/~somedom/geothermex/ 
> geothermex_styles.css
>
> The navigation in the header of the page is png images, yet when I
> increase the type size in the browser, the spacing between the images
> increases until Contact Us, then People, then Publications drop down
> into the white area and effectively disappear.
> I can't figure out what is controlling the space between the images. I
> thought setting the margins and padding on the <li> containing the
> images would do that, but no. What am I missing?
> I started out with html type for those nav elements, but switched to
> images because it seemed impossible to contain the type as it grew.

Images are inline elements. When you increase the text-size the line- 
box that contains the images grows.
A solution:
#navigation img {display:block;}

>
> Question 2: I would actually prefer to use html type instead of images
> there, but I could not think of a clever way to keep the words from
> disappearing when they got larger and pushed down over the white page
> background.
> Does anybody have a good idea about how that could be accomplished?
> If not, I would sure like a solution to #1.
The height of your header is locked (height:199px;}
and the box for your navigation is absolute positioned.

A solution:
1. remove the height declaration for your #header
2. float your navigation box
3. make sure the #header contains the floated block by either  
inserting a clearing element or using one the other techniques for  
containing floats.

You'll have to make the background image for #header taller to allow  
for the whole thing to grow.

ps - don't ask me to read the text of your navigation, it is sooo small.

Philippe
---
Philippe Wittenbergh
<http://emps.l-c-n.com>




______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to