Lively discussions on the graphic arts and publishing — in print or on the web

Go Back   Desktop Publishing Forum > General Discussions > Web Site Building & Maintenance

Thread Tools Display Modes
Prev Previous Post   Next Post Next
Old 03-26-2006, 05:10 AM   #1
CarlSeiler's Avatar
Join Date: Oct 2005
Location: Denton, TX
Posts: 276
Default Some challenges with new site

Reference: Page and css file

Finally started on the new project that I talked about some weeks ago.

Running into a few challenges right off the bat. First, the site they gave me as a "we-want-it-to-look-like-that" example had a menu across the top that was a table. No problem, I thought. Can easily do that with a UL with the LIs inline and floated left. Sure enough the menu looks good on first inspection. What the problem is is that it falls apart when I change screen sizes and browsers. There are five LIs making up the menu. I would think that I could make each one 20% width and they'd all fit snuggly in there. Ah, but what I find is that the "width" specified is only for the item itself, not including the padding and margins, so I have to subtract some for that. But how much? Very frustrating, but I've got it almost OK with 18 percent. Still, on IE, the 5th menu item likes to slip down to the next line. Any tips on this would be appreciated, but I think I'm headed in the right direction on it, and I'm going to try different padding and margin units next (currently em's).

The next issue, and one of the main reasons I'm posting in this stage of the game, is the space on the left-hand side of the menu (DIV class directory). I've attached a PNG of a screen capture. In both FF 1.5x and IE 6x, there's a fixed space to the left of the menu, and even though the list changes size as I change browser size, the gap to the left of the list is fixed. What is causing it to be fixed, and can I make this gap shrink and enlarge as the browser window changes?

Finally (at least for this post), there's a distinct difference in the way that IE and FF display the two columns. I tried to base this off the old example in Lie and Bos. This is currently specified using CSS in the HTML file, but eventually I'll move it to the CSS file. The first column is a width of 50%. The second is also 50% with a margin of 50%. They should fill the parent all the way across. This works pretty nicely in FF. In IE 6.x, it would seem that IE wants to make the first column 50% of the parent, but the second column which should be 50% of the parent is instead 50% of the space available, so it's only 25% of the parent. Grrrr! Question is, how can I specify different widths so as to handle the fact that IE seems to be messing up on the second column?

Attached Thumbnails
Click image for larger version

Name:	working1.png
Views:	109
Size:	17.3 KB
ID:	485  
CarlSeiler is offline   Reply With Quote

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Is my site better now? zofiaphoto Web Design 19 08-24-2006 04:12 AM
WWW Site Down? HTMLAlan Web Site Building & Maintenance 13 07-23-2006 01:38 PM
Yet another CSS help site annc Web Site Building & Maintenance 4 10-07-2005 09:46 PM
New Directions, New Challenges Clayton General Publishing Topics 11 04-19-2005 04:28 PM

All times are GMT -8. The time now is 02:45 AM.

Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Contents copyright 2004–2018 Desktop Publishing Forum and its members.