A look at my CSS is needed.

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View

Hello All,

I posted this the other day over in c.i.w.a.s and only had a single
response from Mr. Shagnasty (Thanks). I thought I would post it here as
   my experience has been that this is a more active group and Mr.
Shagnasty wasn't able to look at it with IE.

So here is what I wrote yesterday

I am redesigning our current website and am going for the tableless
layout and fluid design. Yeah! Right? Only I am no CSS expert.

I've got the basic design but have hit two problems that I was hoping
someone might take a look at the page and maybe tell me how to fix it.

1st. The top banner area is divided into 3 divs. When I resize in
Mozilla, Firefox and Safari there is a vertical white stripe between the
center and right div and depending on where I stop it may or may not be

2nd. In IE6, there is a white space between the banner area and the
"menu bar" that I can not make go a way. This does not occur in Mozilla,
  Firefox or Safari.

Also, if anyone sees where I might have glaring problems in the rest of
the CSS and wants to alert me to these I would be grateful.

The link to the page in question is here;

Thanks for your time and help,

Patrick A. Smith           Assistant System Administrator
Ocean Circulation Group USF - College of Marine Science
http://ocgweb.marine.usf.edu Phone: 727 553-3334

The trouble with doing something right the first time is that nobody
appreciates how difficult it was. - La Rochefoucauld

Re: A look at my CSS is needed.

Patrick Smith wrote:

Quoted text here. Click to load it

Try this replacement for your CSS for all the parts to and including the
.imgholder.  Wrap a new <div id="topcontainer"> around your other three
"top" divs. Works in Firefox, Opera, and IE6.

<style type="text/css">
   font: 100% #000 arial, sans-serif;  /* don't forget fallback font */
   margin: 0;
   padding: 0;
#topcontainer {
   background-image: url(bgforlogowbgsm.jpg);
   background-repeat: repeat-x repeat-y;
   height: 7em;

#topcontentleft {
   background: transparent;
#topcontentcenter {
   background-color: transparent;
#topcontentright {  
   background-color: transparent;
.imgholder {
   padding-left: 2.5em;

Further, I removed every instance of "position: relative" and nothing
changed. They do not seem to be necessary at all.

(Also posted answer in ciwas for those who don't read this group.)

   -Motorcycles defy gravity; cars just suck

Site Timeline