20 replies [Last post]
Chris Passeno
Offline
newbie
Delaware, Ohio
Last seen: 17 years 23 hours ago
Delaware, Ohio
Timezone: GMT-5
Joined: 2005-10-06
Posts: 6
Points: 0

I'm admittedly a novice when it comes to css, and I know that explorer has some short-bus issues with css. I brows with firefox, but the majority of my views are using Explorer.

The Problem
I have a horizontal menu under on my website, underneath my main graphic. It shows fine in Firefox, but is drastically shortened when viewed in Explorer.

The CSS
/* The Navigation Bar. */
#menu {
text-align:center;
font-family: sans-serif, geneva, arial;
font-size:76%;
display:table;
width:652px;
padding:0;
margin:0 auto;
list-style-type:none;
white-space:nowrap;
}
#menu li {
display:table-cell;
}
* html #menu li {
float:left;
}
#menu a {
width:auto;
display:block;
padding:4px 16px;
color:#fff;
background:#0d99b0;
border-left:1px solid #000;
border-right:1px solid #000;
text-decoration:none;
}
* html #menu a {
float:left;
}
#menu a:hover {
color:#fff;
background:#054a51;
}

.container {clear:both; text-decoration:none;}
* html .container {display:inline-block;}


The Question
What's the fix?

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 8 years 31 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

Horizontal Menu different in Explorer, but right in Firefox.

Is IE in standards mode? Can you show us more code or better still a link?

Chris Passeno
Offline
newbie
Delaware, Ohio
Last seen: 17 years 23 hours ago
Delaware, Ohio
Timezone: GMT-5
Joined: 2005-10-06
Posts: 6
Points: 0

Horizontal Menu different in Explorer, but right in Firefox.

My website is here.

My Stylesheet is here.

Any help would be appreciated.

Anonymous
Anonymous's picture
Guru

Horizontal Menu different in Explorer, but right in Firefox.

You are in quirks mode. Dump the xml prolog. <?xml version="1.0" encoding="iso-8859-1"?>

On a side note xhtml 1.1 should be served as application/xhtml+xml and not text/html

http://www.w3.org/TR/xhtml-media-types/#summary

http://www.csscreator.com/css-forum/ftopic4871.html

Also, I am not too tolerant of making fun of mentally challenged people. Sad

Chris Passeno
Offline
newbie
Delaware, Ohio
Last seen: 17 years 23 hours ago
Delaware, Ohio
Timezone: GMT-5
Joined: 2005-10-06
Posts: 6
Points: 0

Horizontal Menu different in Explorer, but right in Firefox.

Thanks for looking it over. I really appreciate the time you took to help me.

On a side note, I fail to see where I'm making fun of mentally challenged people. If you could email me and let me know what offended you on my personal blog, I'm appreciate it.

Thanks,
Chris

Anonymous
Anonymous's picture
Guru

Horizontal Menu different in Explorer, but right in Firefox.

Chris Passeno wrote:
I fail to see where I'm making fun of mentally challenged people. If you could email me and let me know what offended you on my personal blog, I'm appreciate it.
I was referring to this:
Chris Passeno wrote:
...explorer has some short-bus issues...
Don't sweat it. Perhaps you just don't know what it is like to live with and be responsible for someone with disabilities.

thepineapplehead
thepineapplehead's picture
Offline
Moderator
Last seen: 23 weeks 1 day ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9683
Points: 819

Horizontal Menu different in Explorer, but right in Firefox.

Grrrr . . . we don't take kindly to discrimination.

Friends?

Verschwindende wrote:
  • CSS doesn't make pies

Anonymous
Anonymous's picture
Guru

Horizontal Menu different in Explorer, but right in Firefox.

thepineapplehead wrote:
Friends?
Laughing out loud

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 7 years 51 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Horizontal Menu different in Explorer, but right in Firefox.

Triumph wrote:
Chris Passeno wrote:
I fail to see where I'm making fun of mentally challenged people. If you could email me and let me know what offended you on my personal blog, I'm appreciate it.
I was referring to this:
Chris Passeno wrote:
...explorer has some short-bus issues...
Don't sweat it. Perhaps you just don't know what it is like to live with and be responsible for someone with disabilities.

Is that a US term cos I don't get it? :?

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

Anonymous
Anonymous's picture
Guru

Horizontal Menu different in Explorer, but right in Firefox.

Tyssen wrote:
Is that a US term cos I don't get it? :?
It must be. In most school districts here the "special needs" (including the wheelchair bound and the mentally retarded) children are bussed to school in a short bus with only about 10 or 12 rows of seats while every other bus has somewhere around 20 or 24 rows of seats. This is mainly because there are less of them than there are "normal" children.

So to say to someone "you ride the short bus" is basically calling someone retarded.

Chris Passeno
Offline
newbie
Delaware, Ohio
Last seen: 17 years 23 hours ago
Delaware, Ohio
Timezone: GMT-5
Joined: 2005-10-06
Posts: 6
Points: 0

Horizontal Menu different in Explorer, but right in Firefox.

Again, thanks for helping me. I will adjust my site and see if that works.

I don't view my "shortbus" comment as discriminatory or insulting, but I can see where it could be. I appologize if I have offended anyone and will try and be more understanding in the future. Friends Smile

thepineapplehead
thepineapplehead's picture
Offline
Moderator
Last seen: 23 weeks 1 day ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9683
Points: 819

Horizontal Menu different in Explorer, but right in Firefox.

Chris Passeno wrote:
I don't view my "shortbus" comment as discriminatory or insulting, but I can see where it could be. I appologize if I have offended anyone and will try and be more understanding in the future. Friends Smile

Don't worry about it Laughing out loud different cultures, different word, etc.

Just glad you got your webpage problem sorted Laughing out loud

Verschwindende wrote:
  • CSS doesn't make pies

Anonymous
Anonymous's picture
Guru

Horizontal Menu different in Explorer, but right in Firefox.

Chris Passeno wrote:
I don't view my "shortbus" comment as discriminatory or insulting...
Hey, comparing anyone to IE is an insult. Wink Laughing out loud

drhowarddrfine
Offline
Leader
Last seen: 12 years 44 weeks ago
Timezone: GMT-6
Joined: 2005-05-21
Posts: 764
Points: 0

Horizontal Menu different in Explorer, but right in Firefox.

Quote:
Is that a US term cos I don't get it?
I've never heard that used before either and I'm in the US.

IE7 is 10 years behind the standards or wrong.
But it works in IE!
IE is a cancer on the web -- Paul Thurott

Chris Passeno
Offline
newbie
Delaware, Ohio
Last seen: 17 years 23 hours ago
Delaware, Ohio
Timezone: GMT-5
Joined: 2005-10-06
Posts: 6
Points: 0

Horizontal Menu different in Explorer, but right in Firefox.

I believe that I've made the adjustments to my site, but for some reason, my menu bar won't extend far enough in IE. It's supposed to be 650px to align with the graphic.

Any idea how to fix that?

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 8 years 31 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

Horizontal Menu different in Explorer, but right in Firefox.

You're relying on font size and padding to determine the width of the anchors. Why not set the anchors to display block and set the width to be equal (130px - any border you want)?

Chris Passeno
Offline
newbie
Delaware, Ohio
Last seen: 17 years 23 hours ago
Delaware, Ohio
Timezone: GMT-5
Joined: 2005-10-06
Posts: 6
Points: 0

Horizontal Menu different in Explorer, but right in Firefox.

I understand what you mean, but I'm not sure how to implement it. Could you show me with the code below?

/* The Navigation Bar. */
#menu {
text-align:center;
font-family: sans-serif, geneva, arial;
font-size:76%;
display:table;
width:652px;
padding:0;
margin:0 auto;
list-style-type:none;
white-space:nowrap;
}
#menu li {
display:table-cell;
}
* html #menu li {
float:left;
}
#menu a {
width:auto;
display:block;
padding:0px 16px;
color:#fff;
background:#0d99b0;
border-left:1px solid #000;
border-right:1px solid #000;
text-decoration:none;
}
* html #menu a {
float:left;
}
#menu a:hover {
color:#fff;
background:#054a51;
}

.container {clear:both; text-decoration:none;}
* html .container {display:inline-block;}

Thanks,
Chris

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 8 years 31 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

Horizontal Menu different in Explorer, but right in Firefox.

Not tested:

#menu {
    text-align:center;
    font-size:76%;
    width:650px;
    padding:0 0 0 1px;
    margin:0 auto;
    list-style-type:none;
    border:1px solid #000;
    overflow: hidden;
    }

#menu li {
    float: left;
    background:#0d99b0;
    border-right:1px solid #000;
    }

#menu a {
    width: 129px;
    display:block;
    color:#fff;
    text-decoration:none;
    }

#menu a:hover {
    background:#054a51;
    }
 

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 30 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

Horizontal Menu different in Explorer, but right in Firefox.

drhowarddrfine wrote:
Quote:
Is that a US term cos I don't get it?
I've never heard that used before either and I'm in the US.

I'm with you. My first thought was a metaphor for the power or ground bus not reaching all stages of the circuit, thus a non-working circuit.

For those of you who have not worked with low impedance amplifiers, even a small difference in power feed or ground return impedance between stages or even within a single stage that lacks a common bus point, can cause unexpected current loops that lead to unexpected (and sometimes catastrophic) results. Thus the use of a common bus for all power or ground returns. A short bus would not be good.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

drhowarddrfine
Offline
Leader
Last seen: 12 years 44 weeks ago
Timezone: GMT-6
Joined: 2005-05-21
Posts: 764
Points: 0

Horizontal Menu different in Explorer, but right in Firefox.

So, Gary, are you like me, an ex-hardware guy?

IE7 is 10 years behind the standards or wrong.
But it works in IE!
IE is a cancer on the web -- Paul Thurott

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 30 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

Horizontal Menu different in Explorer, but right in Firefox.

Ham radio.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.