Need help with font color change

CynthiaM

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

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

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

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&quot; 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

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

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

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

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

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

Allen wrote: »

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

Ahh! Now I get it. Thank You!!

RKnecht

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

http://www.richknechtphotography.com/

CynthiaM

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

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