Как сохранить цвет ссылок на кнопках CSS как один цвет при изменении цветов ссылок по умолчанию?

Question

Я искал аналогичный вопрос, но либо это вопиющая ошибка, которую я просто не вижу, либо я просто плохо формулирую свои поиски.

Итак, у меня есть задание создать базовый веб-сайт, однако я решил пойти дальше и просто создать бизнес-сайт, который я хотел, затем представить, что, однако, я столкнулся с проблемой, которую я не могу представить найти путь вокруг. Из-за того, что мой фон немного темный на моей веб-странице, я хотел бы скрасить цвета ссылок по умолчанию, чтобы они все еще были узнаваемы как ссылки, но легко читаемы. Однако, используя кнопки CSS для моего меню, он меняет цвет текста на кнопках, даже если текст его явно установлен в белый цвет в коде кнопок.

Если вы хотите увидеть что-то, о чем я говорю в действии, в настоящее время существует версия моего сайта here.. Это версия с яркими цветами ссылок.

Что касается кода моей кнопки, это выглядит следующим образом:

.homebutton { 
font-size:15px; 
font-family:Georgia; 
font-weight:normal; 
color: #FFFFFF; 
-moz-border-radius:5px; 
-webkit-border-radius:5px; 
border-radius:5px; 
border:1px solid #b33329; 
padding:10px 30px; 
text-decoration:none; 
background:-webkit-gradient(linear, left top, left bottom, color-stop(21%, #cc372d), color-stop(84%, #8a2b23)); 
background:-moz-linear-gradient(center top, #cc372d 21%, #8a2b23 84%); 
background:-ms-linear-gradient(top, #cc372d 21%, #8a2b23 84%); 
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#cc372d', endColorstr='#8a2b23'); 
background-color:#cc372d; 
display:inline-block; 
text-shadow:1px 1px 0px #810e05; 
-webkit-box-shadow:inset 1px 1px 0px 0px #f5978e; 
-moz-box-shadow:inset 1px 1px 0px 0px #f5978e; 
box-shadow:inset 1px 1px 0px 0px #f5978e; 
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box; 
     box-sizing: border-box; 
} 

.homebutton:hover { 
background:-webkit-gradient(linear, left top, left bottom, color-stop(21%, #8a2b23), color-stop(84%, #cc372d)); 
background:-moz-linear-gradient(center top, #8a2b23 21%, #cc372d 84%); 
background:-ms-linear-gradient(top, #8a2b23 21%, #cc372d 84%); 
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8a2b23', endColorstr='#cc372d'); 
background-color:#8a2b23; 
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box; 
     box-sizing: border-box; 
} 

.homebutton:active { 
position:relative; 
top:1px; 
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box; 
     box-sizing: border-box; 
} 

Это точный код CSS для кнопки «дома», используемого на веб-странице.

Любая помощь или проницательность, предоставленная вам, будут оценены по достоинству и благодарны за то, что нашли время, чтобы посмотреть на мою просьбу, по крайней мере, ха-ха.

-Sky

Answer 1

вам нужно определить правила для ссылок внутри вашей кнопки, добавьте в ваш CSS

a.homebutton{ 
    color: #FFF;  
} 

проверить эту скрипку, чтобы увидеть пример: http://jsfiddle.net/victorrseloy/mHLea/

Answer 2

элемент селектор имен сильнее имени класса, поэтому ваше правило для элементов «a» перезапишет правило «.homebutton».

Вы можете легко исправить это, вам нужно добавить элемент «a» в свой селектор правил, поэтому замените «.homebutton» на «a.homebutton» в вашем css.