• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 306
  • Last Modified:

Problem with overlapping css sheets...

So here is the link to the problem page http://www.billsprice.com/index2.php

I added two jquery things, the autosuggest and the scroller with graphics.

They are running on two versions of jquery and i tried to change the scrollers css to different classes so it would look, however, this did not work.

Here is the reverted version, any thoughts on exactly what i need to change to make the scroller thing not look all screwed up?
0
blink10
Asked:
blink10
  • 11
  • 8
  • 2
  • +2
1 Solution
 
Jagadishwor DulalBraces MediaCommented:
I just changed your css of myaccountdontdelete.css line no 1063 to like below :

#featured2 .ui2-tabs-panel {
    background: none ;
    height: 250px;
    margin-left: -20px;
    margin-top: -15px;
    position: relative;
    width: 390px;
}

Open in new window


So it seems ok in firefox please check in your
0
 
blink10Author Commented:
i just tried this but no luck.
0
 
MelMcCommented:
To class .#featured2 UL.ui2-tabs-nav LI SPAN in file myaccountdontdelete.css
Add the following
width:95px;
word-wrap:break-word;
float:left;
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
blink10Author Commented:
i just added it, no luck
0
 
MelMcCommented:
I just browser tested it and it did work.
What browser are u using?
0
 
blink10Author Commented:
all browsers, firefox, chrome, etc.
0
 
blink10Author Commented:
For reference I just changed it back to without the competting style sheet. It is almost back to how its suppose to long, minus, it suppose to highlight gray option on the right.
0
 
MelMcCommented:
What stylesheet did u remove?
0
 
blink10Author Commented:
<link href="css/start/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css" />
0
 
MelMcCommented:
The options are gray on hover, what am I missing?
0
 
nap0leonCommented:
Page looks fine to me in IE8, FF 6, Chrome 13, and Opera 11.5
(positioning is waaay off in IE6).

What is broken?
0
 
MelMcCommented:
IE6 does not hold to the normal browser standards, I would not expect the page to look correct in IE6, that is why Microsoft is trying to get rid of it...
http://www.ie6countdown.com/
0
 
blink10Author Commented:
@ melmc It was suppose to be gray on selected two

@ nap0leon I removed the competing stylesheet, which is why it looks normal
0
 
blink10Author Commented:
This isnt a IE issue, this is an all browser issue.
0
 
nap0leonCommented:
Again.. what is broken?  The page looks fine and you did not really describe the error condition.
(you mentioned "autosuggest" and "scroller with graphics", which perhaps you already removed these.)

(and yes, the IE6 broken thing was in parenthesis b/c of course no one *should* be running IE6, but it is one that I happen to have to support at my company so I habitually look at it in that browser anyway)
0
 
blink10Author Commented:
Sorry, now i added the jquery style sheet back in. Now you can see how it messes up the scroller.
0
 
MelMcCommented:
What does that mean? Do you mean the content is behind the scrollbar?
0
 
blink10Author Commented:
I mean it isnt using the original stylesheet, the jquery sheet is overwriting it and messing it up. Let me show u screenshots.

Before adding stylesheet http://www.billsprice.com/177.png
After adding http://www.billsprice.com/277.png

0
 
MelMcCommented:
U need the original style sheet to load after the one that is messing it up. Change the order of your link tags.
0
 
blink10Author Commented:
ok now the original style sheet loads last, no luck however.
0
 
MelMcCommented:
Make sure that you keep the original style sheet loading after the jquery one.
In the myaccountdontdelete.css do the following:
1. For Class #feature Delete height:245px;
2. Add class .ui-tabs .ui-tabs-panel{padding:0px;}
3. Add class .ui-tabs{padding:0px;}

Please put that in place, still working on the right column.
0
 
blink10Author Commented:
can you tell me what classes are overlapping and then ill just change the class names? Thats what I was trying to do orignally and couldnt determine.
0
 
Bob LearnedCommented:
There appears to be confusion surrounding what "scroller" that you are referring to.  My suggestion would be to attach a .png screen shot that highlights what you are referring to, in order to provide a reasonable answer.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

  • 11
  • 8
  • 2
  • +2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now