9 replies [Last post]
smk2007
smk2007's picture
Offline
Enthusiast
Last seen: 9 years 41 weeks ago
Timezone: GMT-8
Joined: 2007-01-04
Posts: 135
Points: 7

I'm having a small glitch in IE6 only. I created a rounded gradient button that has been sliced in two parts to enable the tab to be stretched according to the content in it. When I hover over the tab/link in IE6 (note:this works in all other browsers) the left small side of the hover button does not appear but only the right side of the button. Does anyone have any advice? If the best solution was to create a css for IE6 only, how do I go about doing that? Thanks for any help...

HTML



  • Home

  • Programs

  • About Us

  • Staff

  • Messages

  • Events

  • Find Us

  • Contacts


CSS

#headerNav { width:770px; font-size:1.1em; line-height:normal; padding-top:41px; margin:0 auto; clear:both }
#headerNav ul { padding:10px 10px 0 10px; list-style:none; float:right }
#headerNav li { margin:0 1px 0 0; padding:0 0 0 9px; float:left; background:url(../images/left-bt.gif) no-repeat left top }
#headerNav a {
float:left;
text-decoration:none;
color:#fff;
display:block;
background:url(../images/right-bt.gif) no-repeat right top;
padding:5px 15px 4px 6px;
}
/* Commented Backslash Hack
hides rule from IE5-Mac \*/
#headerNav a {float:none }
/* End IE5-Mac hack */
#headerNav a:hover { color:#fff }
#headerNav #current, #headerNav li:hover { background-image:url(../images/left-on-bt.gif) }
#headerNav #current a, #headerNav a:hover { background-image:url(../images/right-on-bt.gif); color:#fff; padding-bottom:4px }

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 36 weeks 1 day ago
Joined: 2004-06-30
Posts: 9668
Points: 801

http://csscreator.com/node/19

Verschwindende wrote:
  • CSS doesn't make pies

smk2007
smk2007's picture
Offline
Enthusiast
Last seen: 9 years 41 weeks ago
Timezone: GMT-8
Joined: 2007-01-04
Posts: 135
Points: 7

? not sure what you are saying here...

E-mail can be so tricky at times... I read the link you provided. I've posted my code and described the problem, so I'm at a total loss why you sent that link. I would appreciate it if you would elaborate. Thanks.

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 48 weeks 6 days ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

smk2007 wrote:E-mail can be

smk2007 wrote:
E-mail can be so tricky at times... I read the link you provided. I've posted my code and described the problem, so I'm at a total loss why you sent that link. I would appreciate it if you would elaborate.

Re-read the message referred to. You will see the word "all". We need to see all of your code, every single bit of it, or we can't really help. You have only shown part of your html. We need all of it and all your CSS too. Not just the parts you think must be the important bits, all of it.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

Triumph (not verified)
Anonymous's picture
Guru

smk2007 wrote:E-mail can be

smk2007 wrote:
E-mail can be so tricky at times... I read the link you provided. I've posted my code and described the problem, so I'm at a total loss why you sent that link. I would appreciate it if you would elaborate. Thanks.

Well, this may seem a bit strange but I went back and looked at all of your requests and you've been asked to post all of your code something like eight times. I guess we just assume it will sink in after a few times. In case it still hasn't, we need to see all of your code. That means all of the html and all of the css. If images are important to the diagnosis of the problem then a link is better than posting code unless you specify a full path to the images. Snippets are not good enough. One or the other is not good enough. Really it is all about you making it as easy as possible for the people here to help you.

Personally, I'm going to just stop posting links to the stickies and just ignore all questions that don't follow the guidelines or rules. I think I'm going to be rather idle around here.

Sorry to be so harsh but you've been her long enough to know.

smk2007
smk2007's picture
Offline
Enthusiast
Last seen: 9 years 41 weeks ago
Timezone: GMT-8
Joined: 2007-01-04
Posts: 135
Points: 7

ok - sorry about that...

Here is the full code posted below (although it's not much) and attached are my images. I don't have a live link to post as I am working on this offline.

SAMPLE TEMPLATE

* { margin:0; padding:0 }
BODY {
font-size: 76%;
background: #2D0C01 url(../images/top-bg.gif) top repeat-x;
font-family: Tahoma, Verdana, Arial;
color: #fff;
}
#headerNav { width:770px; font-size:1.1em; line-height:normal; padding-top:23px; margin:0 auto; clear:both }
#headerNav ul { padding:10px 10px 0 10px; list-style:none; float:right }
#headerNav li { margin:0 1px 0 0; padding:0 0 0 9px; float:left; background:url(../images/left-bt.gif) no-repeat left top }
#headerNav a {
float:left;
text-decoration:none;
color:#fff;
display:block;
background:url(../images/right-bt.gif) no-repeat right top;
padding:5px 15px 4px 6px;
}
/* Commented Backslash Hack
hides rule from IE5-Mac \*/
#headerNav a {float:none }
/* End IE5-Mac hack */
#headerNav a:hover { color:#fff }
#headerNav #current, #headerNav li:hover { background-image:url(../images/left-on-bt.gif)}
#headerNav #current a, #headerNav a:hover { background-image:url(../images/right-on-bt.gif); color:#fff; padding-bottom:4px }

  • Home
  • Programs
  • About Us
  • Staff
  • Messages
  • Events
  • Find Us
  • Contacts

There is no piont in me being offended. I appreciate all of you and I apologize that I have not gotten it until now to post all code. Thanks...

AttachmentSize
right-bt.gif 1.21 KB
right-on-bt.gif 1.21 KB
left-bt.gif 628 bytes
left-on-bt.gif 628 bytes
Triumph (not verified)
Anonymous's picture
Guru

smk2007 wrote:... There is

smk2007 wrote:
... There is no piont in me being offended. I appreciate all of you and I apologize that I have not gotten it until now to post all code. Thanks...

Yes, good good! Smile

It is sometimes difficult to say something online because it can be read so many different ways. Some get offended when no offense is intended. Thanks for being understanding.

Triumph (not verified)
Anonymous's picture
Guru

Ok, the problem is that IE6

Ok, the problem is that IE6 doesn't understand :hover on anything except the <a> tag. li:hover is simply being ignored.

I think you're going to have to run some javascript in this case.

May I suggest: Whatever:hover

smk2007
smk2007's picture
Offline
Enthusiast
Last seen: 9 years 41 weeks ago
Timezone: GMT-8
Joined: 2007-01-04
Posts: 135
Points: 7

thank you

I will check out this link and thank you for being so patient. I've finally realized that I'm in such a hurry (wanting to keep my time on the internet short) and because this is a side thing I do, I forget to include obvious details. I believe I have the point now. Again, thank you all for your help and patience. :rolleyes:

smk2007
smk2007's picture
Offline
Enthusiast
Last seen: 9 years 41 weeks ago
Timezone: GMT-8
Joined: 2007-01-04
Posts: 135
Points: 7

Perfect!

Placing the behavior:url("styles/csshover.htc"); into the css body tag works like a charm. Thanks again! :thumbsup: