Change link color into a div

[Norman]

I have this:

<div class="left">		Text: <span class="facebook"><a href="#" title="#">Facebook</a></span>		</div>

This is the .left CSS:

.left { float: left; color: #fff; }

How do I change the color of the link (when link, when hover and when visited) to white? I need it to apply only in that part, then only when it's under the class .left.

[thescientist]

if you gave the div an id you could do it.

#id a{ color: #ffffff;}#id a:hover{ color: #000000f;}

pretty sure that would work.

[real_illusions]

Could target the <a> within that span:This:.left span a{color:#FFFFFF;}or.left span.facebook a{color:#FFFFFF;}which saves adding anything to the HTML.

[Norman]

Thank you! It works. But now I have another problem..I'd like to do the same with this:

<div class="right" style="color: #fff;">		<div class="mlmenu horizontal fade inaccesible">			<ul>				<?php wp_list_pages('title_li='); ?>				<li>				<form method="get" id="searchform" action="<?php bloginfo('home'); ?>/">				  <div id="search">					<input class="searchinput" type="text" value="Cerca nel sito..." onclick="this.value='';" name="s" id="s" />					<input class="searchsubmit" type="submit" value="GO"/>				  </div>				</form>				</li>			</ul>			</div> <!--end: menu-->	</div> <!--end: right-->

[Norman]

No one?

[thescientist]

what are you trying to do?

[Norman]

With this:<?php wp_list_pages('title_li='); ?>wordpress list the subpages. Which are links.. and currently they are #333, or something like that. I want to make them #fff.

[Err]

We need to see the links then.

[Norman]

Oh, ok. This is the generated code:

<div id="headline">	<div class="left" style="color: rgb(255, 255, 255);">		Seguici: <span class="facebook"><a href="http://www.facebook.com/pages/People-dont-know-fan-page/355748045948" title="Iscriviti al fun club di Pdk su Facebook">Facebook</a></span>		<span class="rss"><a href="http://www.peopledontknow.com/feed/" title="Iscriviti al feed RSS per gli ultimi articoli">RSS Articoli</a></span>			</div> <!--end: left-->	<div class="right">		<div class="mlmenu horizontal fade inaccesible">			<ul>				<li class="page_item page-item-2"><a href="http://www.peopledontknow.com/about/" title="About">About</a></li>				<li>				<form method="get" id="searchform" action="http://www.peopledontknow.com/">				  <div id="search">					<input class="searchinput" value="Cerca nel sito..." onclick="this.value='';" name="s" id="s" type="text">					<input class="searchsubmit" value="GO" type="submit">				  </div>				</form>				</li>			</ul>			</div> <!--end: menu-->	</div> <!--end: right-->	<div class="clear"></div></div> <!--headline-->

[thescientist]

if you give an element an id, you can target only those selectors that are children of that element.

#id{  //code}#id a{  color: #ffffff;}

and you can do it with classes too, which real_illusions explained, which I guess leaves me wondering, what is different about this than the previous example that you were helped out with?

[Norman]

Than.. will I need to add a CSS declaration like this..

#page_item a {color: #fff; }

?

[real_illusions]

Its a class, so you'll need a . instead of #li.page_item a{color:#FFFFFF;}orli.page-item2 a{color:#FFFFFF;}I'd go for the 2nd option, as its a secondary class on that item, and changing .page_item may change other links with that primary class else where on the page. You can leave the li bit off, but if you leave it in, then its more specific as it targets only <a> tags that within a <li> with a class name of .page_item2

[Norman]

I tried both, but they doesn't work..

[thescientist]

does your class name match up in the CSS and HTML? Double check whether you are using _'s or -'s, as the examples had them switched up.

[real_illusions]

oopsie...was supposed to be:li.page-item-2 aDamn underscores and hyphens...i dont use them for precisely the reason of typos and mixups which just happened.

[thescientist]

oopsie...was supposed to be:li.page-item-2 aDamn underscores and hyphens...i dont use them for precisely the reason of typos and mixups which just happened.

we should talk about parsing HTML in PHP. apostrophe's and quotation marks.... that's some smiles and cries there!

[Norman]

Thank you guys, I was missing a class. The correct code is this:

.horizontal li.page_item a {color:#FFFFFF;}

[real_illusions]

we should talk about parsing HTML in PHP. apostrophe's and quotation marks.... that's some smiles and cries there!

<?php echo "<p class=\"yeah\">" . $variableofyesindeedy . "<img src=\"" . $winkieicon . "\" alt=\"\" /></p>"; ?>