twilitegxa Posted August 26, 2008 Share Posted August 26, 2008 When I open my test page in Firefox, there are some color inconsistencies. The "address" lines show be teal, but for some reason the first letter is showing up as a golden color, as well as the H1 text, and it is set to teal as well. What could be causing this? How can I fix it? Here is my CSS code: .treeview ul{ /*CSS for Simple Tree Menu*/ margin: 0; padding-left: 10; } .treeview li{ /*Style for LI elements in general (excludes an LI that contains sub lists)*/ list-style-type: none; padding-left: 0px; margin-bottom: 3px; } .treeview li.submenu{ /* Style for LI that contains sub lists (other ULs). */ cursor: hand !important; cursor: pointer !important; } .treeview li.submenu ul{ /*Style for ULs that are children of LIs (submenu) */ display: none; /*Hide them by default. Don't delete. */ } .treeview .submenu ul li{ /*Style for LIs of ULs that are children of LIs (submenu) */ cursor: default; } /* Main Sailor Moon screen styles */ body {color: #99CCFF} h1, h2, h3, h4, h5, h6 {font-family: sans-serif; color: teal} address {color: teal; font-style: normal; font-variant: small-caps; text-align: center; clear: both; border-top: 1px solid orange} #head {text-align: right; border-bottom: 1px solid orange} #treemenu1 {width: 170px; float: left; background-color: rgb(212, 142, 0); margin-right: 10px; padding: 10px 10px 10px 2px; border: 2px solid black; color: white; font-size: 8pt; font-family: sans-serif} /* when closed, width needs to be 150px and right padding 10, but when open, width needs to be 300px and right padding needs to be 20px for the Getting Started section to display properly. Ask Carson for help. */ #treemenu1 a {display: block; font-family: sans-serif; color: white; font-size: 8pt} li.newgroup {margin-top: 15px} #treemenu1 a:link {text-decoration: none} #treemenu1 a:visited {text-decoration: none} #treemenu1 a:hover {color: black; text-decoration: none} #treemenu1 a:active {text-decoration: none} #main {width: 70%; float: left; padding-left: 10px} #treemenu1 a.select {color: black; text-decoration: underline} p {text-indent: 30pt} a:link {color: red; font-size: 20pt} a:visited { color: green; font-size: 20pt} a:hover {color: magenta; font-size: 20pt} a:active {text-decoration: none; font-size: 20pt} a.current {text-decoration: none} address a:link {text-decoration: none; font-size: 14pt; color: teal} address a:visited {text-decoration: none; font-size: 14pt; color: teal} address a:hover {text-decoration: underline; color: black; font-size: 14pt} address a:active {text-decoration: none; color: teal; font-size: 14pt} address a.select {text-decoration: underline; color: black; size: 14pt} #attributes a:link {font-size: 12pt; color: blue} Quote Link to comment Share on other sites More sharing options...
RalphOrange Posted August 26, 2008 Share Posted August 26, 2008 It might be something in the web page code itself and not in the CSS file. Almos like overriding it the CSS. Quote Link to comment Share on other sites More sharing options...
twilitegxa Posted August 26, 2008 Author Share Posted August 26, 2008 The problem is, I can't see any problems! LOL Here is the sample page code. If anyone sees the problem, let me know: <html> <head> <title>Sailor Moon RPG - Home Page</title> <script type="text/javascript" src="simpletreemenu.js"></script> <link rel="stylesheet" type="text/css" href="simpletree2.css" /> </head> <body> <div id="head"><img src="logo.jpg" alt="Sailor Moon RPG Logo" width="314" height="75" /><br /> <address><a href="home.html">Home</a> | <a href="register.html">Register</a> | <a href="login.html">Log In</a> | <a href="help.html">Help</a> </address></div> <ul id="treemenu1" class="treeview"> <li><a href="home.html" title="Home Page">Home</a></li> <li><a title="Getting Started">Getting Started</a> <ul> <li><a title="Introduction">Chapter 1: Introduction</a> <ul> <li><a href="genre1.html" title="The Magical Girl Genre">The Magical Girl Genre</a></li> <li><a href="sailormoon1.html" title="Bishojo Senshi Sailormoon"><em>Bishojo Senshi Sailormoon</em></a> <li><a title="Sailor Moon Series Background">SM Series Background</a> <ul> <li><a href="summary1.html" title="Season One Summary (Episodes #1 - #40)">Season One Summary</a></li> <li><a href="summary2.html" title="Season Two Summary (Episodes #41 - #53)">Season Two Summary</a></li></ul></li> <li><a href="role1.html" title="What Is Role-Playing?">What Is Role-Playing?</a></li> <li><a href="example1.html" title="An Example Of Play">An Example Of Play</a></li> <li><a href="size1.html" title="Character Size Relationship">Character Size Relationship</a></li> </ul></li> <li><a href="creation.html" class="select" title="Character Creation">Chapter 2: Character Creation</a> <ul> <li><a href="flowchart.html" title="Character Creation Flowchart">Character Creation Flowchart</a></li> <li><a href="gmdiscussion.html" title="GM Discussion">Step 1: GM Discussion</a></li> <li><a href="outline.html" title="Character Outline">Step 2: Character Outline</a></li> <li><a href="stats1.html" title="Assign Stats">Step 3: Assign Stats</a></li> <li><a href="attributes1.html" title="Character Attributes">Step 4: Character Attributes</a> <ul> <li><a href="attributes2.html" title="Scout/Knight Sub-Attributes">Scout/Knight Sub-Attributes</a></li> <li><a href="attributes3.html" title="Negaverse/Dark Sub-Attributes">Negaverse/Dark Sub-Attributes</a></li> <li><a href="attributes4.html" title="Neutral Attributes">Neutral Attributes</a></li> </ul> </li> <li><a title="Character Defects">Step 5: Character Defects</a></li> <li><a title="Derived Values">Step 6: Derived Values</a> <ul> <li><a title="Combat Value">Combat Value</a></li> <li><a title="Health Points">Health Points</a></li> <li><a title="Energy Points">Energy Points</a></li> </ul> </li> <li><a title="Background Points">Step 7: Background Points</a></li> </ul> </li> <li><a title="Game Mechanics">Chapter 3: Game Mechanics</a> <ul> <li><a title="Introduction">Introduction</a></li> <li><a title="Combat Flowchart">Combat Flowchart</a></li> <li><a title="Dice, Stat Checks, & Combat Rolls">Dice, Stat Checks, & Combat Rolls</a> <ul> <li><a title="Stat Checks">Stat Checks</a></li> <li><a title="Combat Dice Rolls">Combat Dice Rolls</a></li> </ul> </li> <li><a title="Taking Action">Taking Action</a></li> <li><a title="Combat">Combat</a> <ul> <li><a title="Initiative">Initiative</a></li> <li><a title="Attack">Attack</a></li> <li><a title="Non-Combat Actions">Non-Combat Actions</a></li> <li><a title="Defend">Defend</a></li> <li><a title="Deliver Damage">Deliver Damage</a></li> </ul> </li> <li><a title="Weapons And Armor">Weapons And Armor</a></li> <li><a title="Recovering Lost Points">Recovering Lost Points</a> <ul> <li><a title="Health Points">Health Points</a></li> <li><a title="Energy Points">Energy Points</a></li> </ul> </li> </ul> </li> <li><a title="Role-Playing In The Sailor Moon Universe">Chapter 4: The SM Universe</a> <ul> <li><a title="Japan And Tokyo">Japan And Tokyo</a></li> <li><a title="Maps Of Japan And Tokyo">Maps Of Japan and Tokyo</a></li> <li><a title="Places In Sailor Moon">Places In Sailor Moon</a></li> <li><a title="Sailor Moon Timeline">Sailor Moon Timeline</a></li> <li><a title="The Moon Kingdom">The Moon Kingdom</a> <ul> <li><a title="The Kingdom Of Light">The Kingdom Of Light</a></li> <li><a title="Members Of The Royal Court">Members Of The Royal Court</a></li> <li><a title="The Planetary Kingdoms">The Planetary Kingdoms</a></li> </ul> </li> <li><a title="The Negaverse">The Negaverse</a> <ul> <li><a title="What Is Known">What Is Known</a></li> <li><a title="Speculation On What Is Unknown">Speculation On Unknown</a></li> </ul></li> <li><a title="Planet Of Makaiju">Planet Of Makaiju</a> <ul> <li><a title="Campaign And Setting Questions">Campaign & Setting Questions</a></li> </ul> </li> <li><a title="Crystal Tokyo">Crystal Tokyo</a> <ul> <li><a title="A Crystal Tokyo Campaign">A Crystal Tokyo Campaign</a></li> </ul></li> <li><a title="Nemesis, The Dark Moon">Nemesis, The Dark Moon</a></li> <li><a title="School Life In Japan">School Life In Japan</a></li> <li><a title="Advice For The Player">Advice For The Player</a></li> </ul> </li> </ul> <li><a href="creationform.html" title="Create Character">Create Character</a></li> <li><a title="Members">Members</a> <ul> <li><a title="Heroes">Heroes</a></li> <li><a title="Villains">Villains</a></li> </ul></li> <li><a href="newsandevents.html" title="News And Events">News And Events</a></li> <li><a href="glossary.html" title="Glossary">Glossary</a></li> <li class="newgroup"><a href="#" title="Item Store">Item Store</a></li> <li><a href="#" title="Shopping Cart">Shopping Cart</a></li> <li><a href="#" title="Checkout">Checkout</a></li> <li><a href="#" title="Your Account">Your Account</a></li> <li class="newgroup"><a href="#" title="About Us">About Us</a></li> <li><a href="#" title="Newsletters">Newsletters</a></li> <li><a href="#" title="Invite Friends">Invite Friends</a></li> <li><a href="#" title="Frequently Asked Questions">FAQ</a></li> <li><a href="#" title="Contact Us">Contact Us</a></li> </li> </ul> <script type="text/javascript"> //ddtreemenu.createTree(treeid, enablepersist, opt_persist_in_days (default is 1)) ddtreemenu.createTree("treemenu1", true) ddtreemenu.createTree("treemenu2", false) </script> <div id="main"> <h1>Character Creation</h1> <p>Creating a new character for The Sailor Moon Role-Playing Game involves a great deal of interaction between the player and the GM. As mentioned in the Introduction, there are numerous possible types of characters that you can create, including:</p> <ul> <li>A female Sailor Scout from the series</li> <li>A male Knight from the series</li> <li>A villain from the series</li> <li>An original descendent of a character from the series</li> <li>A completely original character</li> </ul> <p>If the GM has already developed the outline for a campaign, he or she may impose restrictions on certain types of characters or abilities. After all, it may be difficult to keep your Negaverse warrior alive and well if the GM has asked the other players to create Sailor Scouts from the Silver Millennium. If you have any questions about game mechanics or specific character abilities, talk to the GM before you begin creating your character.</p> <p>In The Sailor Moon RPG you can choose to spend as little as ten minutes creating a character, or upwards of an hour --- the difference is in the amount of details and individuality given to the character. The creation guidelines are easy to understand, flexible, and places the power in your hands. At no time during an RPG campaign do you have more control over the destiny of your character than the creation process</p> </div> <address> <a href="sign.html">Sign Guestbook</a> | <a href="view.html">View Guestbook</a> | <a href="help.html">Help</a> | <a href="contactus.html">Contact Us</a> </address> </body> </html> Quote Link to comment Share on other sites More sharing options...
haku Posted August 26, 2008 Share Posted August 26, 2008 If you aren't already using firebug and colorzilla addons for Firefox, then you should be! Download them, and they will help you track down your issue. Quote Link to comment Share on other sites More sharing options...
twilitegxa Posted August 27, 2008 Author Share Posted August 27, 2008 Okay, thanks. I will try that next. :-) Quote Link to comment Share on other sites More sharing options...
twilitegxa Posted August 27, 2008 Author Share Posted August 27, 2008 Unfortunately, those two add-ons don't appear to be helping much. I don't see any reason why my h1 text is a golden color when the css has it set to teal and the address links (the ones at the top and bottom), are supposed to be teal, but the first letter in each one is also that golden color until I hover over it, then it looks teal. What could be wrong? I don't have any overriding css or html in my html page, so I can't figure out why Firefox is displaying the wrong colors? Quote Link to comment Share on other sites More sharing options...
haku Posted August 27, 2008 Share Posted August 27, 2008 In firebug, use the 'inspect' button, and click on the text in question. Then look in the box on the right (inside the firebug window) to see where and in what file the color is being set for whichever element you are speaking of. Or post a link, and one of us can look at it for you. Quote Link to comment Share on other sites More sharing options...
twilitegxa Posted August 27, 2008 Author Share Posted August 27, 2008 Here is the link to the test page: http://webdesignsbyliz.com/TestPages/testpage.html Quote Link to comment Share on other sites More sharing options...
twilitegxa Posted August 27, 2008 Author Share Posted August 27, 2008 I also tried inspecting it, but I still don't see why it's doing it. Quote Link to comment Share on other sites More sharing options...
twilitegxa Posted August 27, 2008 Author Share Posted August 27, 2008 The color problem also happens when the page is viewed in Opera, so obviously it's something that Internet Explorer doesn't pick up, but others see a problem. Quote Link to comment Share on other sites More sharing options...
ifubad Posted August 28, 2008 Share Posted August 28, 2008 color wise, looks identical in both ie6 and ff2, don't see any problems with the h1 Quote Link to comment Share on other sites More sharing options...
haku Posted August 28, 2008 Share Posted August 28, 2008 I don't see this golden color in IE7 or FF3. It's very possibly an addon you have on your computer. Quote Link to comment Share on other sites More sharing options...
twilitegxa Posted August 28, 2008 Author Share Posted August 28, 2008 I guess it must be. I just don't don't know what it is that makes it look that way in Opera and Internet Explorer. Weird. Any suggestions on what kind of add-on could cause that? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.