Unoffical empeg BBS

Quick Links: Empeg FAQ | RioCar.Org | Hijack | BigDisk Builder | jEmplode | emphatic
Repairs: Repairs

Topic Options
#291365 - 11/12/2006 01:11 Need a little help with HTML/CSS
SonicSnoop
addict

Registered: 29/06/2002
Posts: 531
Loc: Triangle, VA
Hi, I have been searching to see if it is possible to do what I want but have been unsuccessful.. I am making a web page and have a small table on the left with 4 rows each row has a single cell.. inisde each cell I have a single link.. mini nav bar basiclly.. using CSS I have altered the colors of the links using:
Code:

a:link {color: #161a71; text-decoration: none;} /* unvisited link */
a:visited {color: #161a71; text-decoration: none;} /* visited link */
a:hover {color: #FFFFFF; text-decoration: none;} /* mouse over link */
a:active {color: #FFFFFF; text-decoration: none;} /* selected link */



And that part works great.. then I also added a onmouseover and onmouseout attrib's to the table cells to change the background colors when over and off of them..

Code:

<TD align='left' valign='top' onmouseover="style.backgroundColor='#161a71';" onmouseout="style.backgroundColor='#FFFFFF';" nowrap='nowrap'>



however my problem is when I just hover over the cell and not the link i cant see the text, of course as soon as my mouse gets near it changes but I was wondering if maybe there was an easier way to do both of these so as soon as I hover over the cell it changes background and link color so I dont have to be right on the text. Thanks!!!
_________________________
-D Modifying and Tweaking is a journey, not a destination................................ MKIIa : 60gig - 040103286 - Blue - v2 + PCATS tuner MKIIa : 20gig - 040103260 - Blue - v3a8 + Mark Lord Special Edition Cherry Dock

Top
#291366 - 11/12/2006 16:45 Re: Need a little help with HTML/CSS [Re: SonicSnoop]
Cybjorg
addict

Registered: 23/12/2002
Posts: 652
Loc: Winston Salem, NC
Rather than using tables, I would recommend using an unordered list. But in order to achieve your objective using your current code strategy, you'll want to style just the links and not the table cell.

Assuming that you already have the table cell width set, your code should look something like this:

Code:

td a { color: #161a71; /*the color of the text */
background-color: #FFFFFF; /* the color of the background onmouseout*/
text-decoration: none; /* no text underline */
text-align: center; /* centers the text in the cell, assuming that's the effect you are looking for */
display: block; /* determines that the link will take on block properties, allowing the clickable area to fill 100% of the cell space */
}
td a:hover { color: #FFFFFF; /* the color of the text onmouseover */
background-color: #161a71; /* the color of the background onmouseover */
}
td a:visited { color: #161a71; }
td a:active { color: #FFFFFF; }



(Feel free to remove the commenting, of course.)

Top
#291367 - 11/12/2006 17:01 Re: Need a little help with HTML/CSS [Re: Cybjorg]
SonicSnoop
addict

Registered: 29/06/2002
Posts: 531
Loc: Triangle, VA
Thank you so VERY much!! That was exactly what I was trying to do... I know HTML but the CSS is very new to me..
_________________________
-D Modifying and Tweaking is a journey, not a destination................................ MKIIa : 60gig - 040103286 - Blue - v2 + PCATS tuner MKIIa : 20gig - 040103260 - Blue - v3a8 + Mark Lord Special Edition Cherry Dock

Top
#291368 - 11/12/2006 17:46 Re: Need a little help with HTML/CSS [Re: SonicSnoop]
JBjorgen
carpal tunnel

Registered: 19/01/2002
Posts: 3584
Loc: Columbus, OH
Quote:
Thank you so VERY much!! That was exactly what I was trying to do... I know HTML but the CSS is very new to me..


Check this book out. It doesn't really get into the nitty gritty of everything you can do with CSS, but it does a great job of answering why you should bother with CSS in the first place.
_________________________
~ John

Top
#291369 - 12/12/2006 00:49 Re: Need a little help with HTML/CSS [Re: JBjorgen]
SonicSnoop
addict

Registered: 29/06/2002
Posts: 531
Loc: Triangle, VA
thanks for the book suggestion.. I went ahead and ordered it tonight.. should have it by thursday..
_________________________
-D Modifying and Tweaking is a journey, not a destination................................ MKIIa : 60gig - 040103286 - Blue - v2 + PCATS tuner MKIIa : 20gig - 040103260 - Blue - v3a8 + Mark Lord Special Edition Cherry Dock

Top
#291370 - 12/12/2006 04:25 Re: Need a little help with HTML/CSS [Re: SonicSnoop]
Cybjorg
addict

Registered: 23/12/2002
Posts: 652
Loc: Winston Salem, NC
This book is a good reference book that will help with some of the stickier situations with CSS.

Top