5 replies [Last post]
ldexterldesign
Offline
Regular
leeds, uk
Last seen: 11 years 7 weeks ago
leeds, uk
Timezone: GMT+1
Joined: 2007-02-21
Posts: 27
Points: 3

hi,

a simple one (i think). a matter of grouping id's (or possibly classes, amending the xhtml) surely there's an easier way of doing this:

#home a:link,a:visited,a:hover,a:active{
color: #FFFFCC;
text-decoration:none;
background-color:transparent;
}
#bio a:link,a:visited,a:hover,a:active{
color: #FFFFCC;
text-decoration:none;
background-color:transparent;
}
#press a:link,a:visited,a:hover,a:active{
color: #FFFFCC;
text-decoration:none;
background-color:transparent;
}
#gallery a:link,a:visited,a:hover,a:active{
color: #FFFFCC;
text-decoration:none;
background-color:transparent;
}
#contact a:link,a:visited,a:hover,a:active{
color: #FFFFCC;
text-decoration:none;
background-color:transparent;
}

if more material is needed, please say.

many thanks in advance,
lewis

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 46 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Yes there is read up on

Yes there is read up on shorthand ruleset declarations and of the nature of property inheritance i,e look at those rules and think about which are applicable to the actual anchor 'a' tag alone.

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

ldexterldesign
Offline
Regular
leeds, uk
Last seen: 11 years 7 weeks ago
leeds, uk
Timezone: GMT+1
Joined: 2007-02-21
Posts: 27
Points: 3

thanks hugo. mental block.

thanks hugo.

mental block. do you think you could solve it for me in black and white?

lewis

ldexterldesign
Offline
Regular
leeds, uk
Last seen: 11 years 7 weeks ago
leeds, uk
Timezone: GMT+1
Joined: 2007-02-21
Posts: 27
Points: 3

XHTML

XHTML

CSS

.navigation
{
	float: left;
	height: auto;
	margin: 0;
	padding: 0;
	padding-left: 30px;
	padding-top: 15px;
	width: 100px;
}
ul, li
{
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.main_nav
{
	color: #FFFFCC;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 150%;
	margin: 0;
	padding: 0;
}

i have these generic anchors for the whole site, which i'd like to keep:

CSS

a:link
{
	color: #ff9999;
	text-decoration: none;
}


a:visited
{
	color: #ff9999;
	text-decoration: none;
}
a:hover
{
	background-color: #ffffcc;
	color: #ff9999;
	text-decoration: none;
}
a:active
{
	color: #ff9999;
	text-decoration: none;
}

however i would like to apply new anchor properties to the 'sub_nav1' class.

hope that helps,
lewis

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 46 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

You then target the links

You then target the links you want to be styled seperately from the default global anchors by using the id/class identifier that denotes that section i.e:

.sub_nav1 a {text-decoration:none;}
and /or group styles under that descendant selector, but in reality the text decoration property should be taken care of under the general rules and on the anhor rather than pseudo classes, remember that you do not need to repeat many properties just set them on the anchor or anchor link pseudo class, only set rules that change on the psuedo classes.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

ldexterldesign
Offline
Regular
leeds, uk
Last seen: 11 years 7 weeks ago
leeds, uk
Timezone: GMT+1
Joined: 2007-02-21
Posts: 27
Points: 3

safe hugo, much appreciated

safe hugo,

much appreciated input. solved it now. sterling job!

regards,
lewis