s_ff_da_b_ff Posted May 8, 2009 Share Posted May 8, 2009 ok this is my site: www.thesidetracked.com on the right you can see the our 'tabber' with The Side, Catergories, and Archives. now if you hover over the options in there you can see that the font color changes from black to grey and the background of the div does not change like the rest of the dives below on the side bar (scroll down and hover over the links under THE WARD) here is my code for the tabber i dont understand why its not working: /*-------------------------------------------------- .tabbertab = the tab content Add style only after the tabber interface is set up (.tabberlive) --------------------------------------------------*/ .tabberlive .tabbertab { padding:3px; border:1px solid #000; border-top: 1px; background: #ececec; /* If you don't want the tab size changing whenever a tab is changed you can set a fixed height */ /* height:200px; */ /* If you set a fix height set overflow to auto and you will get a scrollbar when necessary */ /* overflow:auto; */ } .tabberlive .tabbertab ul li ul:hover{ color:black; background:#fff; text-decoration:none; } .tabberlive .tabbertab ul li ul a:hover{ color:black; background:#fff; text-decoration:none; } as you can see i want the original bg color to be #ececec then when you hover it goes to white...and also idk why the font is changing to grey? I have it set to black on both accounts... Quote Link to comment Share on other sites More sharing options...
Ken2k7 Posted May 8, 2009 Share Posted May 8, 2009 Wrapping the list with a DIV messed up the CSS. Just get rid of those and leave the list. Quote Link to comment Share on other sites More sharing options...
dbrimlow Posted May 9, 2009 Share Posted May 9, 2009 here is my code for the tabber i dont understand why its not working It isn't working because your page structure is wrong and xhtml markup tags are bad/invalid. This page uses some pretty nasty code right from the get go: <br><center><a href="http://thisaintnomixtape.com/home.html" target="_blank"><img src="http://i4.photobucket.com/albums/y136/NimA06/jetta.jpg" border="0" alt="Photobucket"></a></center><br> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"> <head profile="http://gmpg.org/xfn/11"> <title> thesidetracked</title> That mess will simply create all kinds of problems in every different browser. When the page is invalid and the html tags are wrong, even the best "spec-perfect CSS" will not always work. First, you cannot have markup code before the doctype - you just can't!!! Second, when you do get to the doctype declaration you designate xhtml, and proceed to ignore the most basic rules of xhtml - self-closing tags like images and line breaks. Third you embed tags wrong and wrap tags incorrectly. You cannot wrap bock level tags, like headings and paragraphs, with <span>. Span is used to select and reavise a style WITHIN a block level tag. Wrapping the list with a DIV messed up the CSS. Actually, what ken2k7 meant was that you cannot just have "li" tags flappin' in the breeze with no list type designation (un-ordered list - ul, ordered list - ol, definition list - dl). You certainly can wrap properly coded "lists" within divs (and any other markup level html tag), but you must use a properly coded list tag (ul, ol, dl), to contain the "li" (list item) ... this: <p> <li>item</li> <li>item</li> <li>item</li> </p> Is just plain wrong on so many levels. You need to take a course or get a book on basic html ... you must first understand the concepts of basic html tags before attempting to use xhtml and css. I recommend, "Mastering integrated HTML and CSS" By Virginia DeBolt. 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.