Need help with font color change

CynthiaM · August 27, 2013

At the bottom of my homepage there is a contact link. It is showing up as the accent color. I want it to appear the same as the text in my menu, and like that text, to change to the hover color when hovered over. How do I code this?

Thanks!

Jingle Images · August 27, 2013

CynthiaM wrote: »

At the bottom of my homepage there is a contact link. It is showing up as the accent color. I want it to appear the same as the text in my menu, and like that text, to change to the hover color when hovered over. How do I code this?

Thanks!

try this

#yui_3_8_0_1_1377611735523_607 a, a:hover {
color: #4DE6E6;
}

#yui_3_8_0_1_1377611735523_607  {
color: Black;
}

denisegoldberg · August 27, 2013

Jingle Images wrote: »

try this

#yui_3_8_0_1_1377611735523_607 a, a:hover {
color: #4DE6E6;
}

#yui_3_8_0_1_1377611735523_607  {
color: Black;
}

Based on a comment in this thread it doesn't sound like the yui identifiers are the right things to use here, not sure...

--- Denise

Jingle Images · August 27, 2013

denisegoldberg wrote: »

Based on a comment in this thread it doesn't sound like the yui identifiers are the right things to use here, not sure...

--- Denise

ok then

when you added your contact info you can add in the color there like this

<a href="http://www.cynthiamerzerphotography.com/New-Smug-Stuff/Contact-Me" target="_self" id="yui_3_8_0_1_1377613695789_831"><div style="text-align: center; font-size: 12px; color:red;" id="yui_3_8_0_1_1377613695789_830"><span id="yui_3_8_0_1_1377613695789_832">Contact</span></div></a>

denisegoldberg · August 27, 2013

A better solution is to use an HTML/CSS box for your contact information. Add a div to the CSS with the color you want to use and reference that div in your HTML.

For example, in CSS:

#myFont {
  font-size: 115%;
  color: #999;
}

change the color and font size as desired, then in the HTML box:

<div id="myFont"><a hef="your.link.here">contact me</a></div>

--- Denise

CynthiaM · August 27, 2013

denisegoldberg wrote: »
A better solution is to use an HTML/CSS box for your contact information. Add a div to the CSS with the color you want to use and reference that div in your HTML.

For example, in CSS:
#myFont {
  font-size: 115%;
  color: #999;
}
change the color and font size as desired, then in the HTML box:
<div id="myFont"><a hef="your.link.here">contact me</a></div>
--- Denise

Can't get it to work it shows up everywhere except where I want it.

Allen · August 27, 2013

CynthiaM wrote: »

Can't get it to work it shows up everywhere except where I want it.

Try this. Change the color

.sm-page-layout-region-footer a {color: red !important;}

.sm-page-layout-region-footer a:hover {color: blue !important;}

CynthiaM · August 28, 2013

Allen wrote: »

Try this. Change the color

.sm-page-layout-region-footer a {color: red !important;}

.sm-page-layout-region-footer a:hover {color: blue !important;}

It worked! But here is the million dollar question, how did you identify the element to be changed? I'm finding this to be not so easy in comparison to legacy smugmug.

Allen · August 28, 2013

CynthiaM wrote: »

It worked! But here is the million dollar question, how did you identify the element to be changed? I'm finding this to be not so easy in comparison to legacy smugmug.

Using Firefox I right clicked the element and picked "Inspect Element".

CynthiaM · August 28, 2013

Allen wrote: »

Using Firefox I right clicked the element and picked "Inspect Element".

Ahh! Now I get it. Thank You!!

RKnecht · August 28, 2013

What about making my "log In" text transparent like on the bottom of this page:

http://www.richknechtphotography.com/

CynthiaM · August 28, 2013

Allen wrote: »

Using Firefox I right clicked the element and picked "Inspect Element".

One more question. Where, using these tools, would I find the css that I added? This is what I can't figure out if I am trying to see what someone else has done on their site.

Allen · August 28, 2013

CynthiaM wrote: »

One more question. Where, using these tools, would I find the css that I added? This is what I can't figure out if I am trying to see what someone else has done on their site.

Some browsers have this built in but there are tools to view the CSS/HTML. I use WebDev and FireBug with Firefox.
Links in my siggy.

Tutor for WebDev.
http://dgrin.smugmug.com/gallery/1354921

Need help with font color change

Comments