CODEWITHSUNDEEP
htmlcss
Mihad Aiko
Mihad Aiko

Reputation: 947

How do I get div class styles to work?

For some odd reason my div class styles aren't working.

1.Yes the css is linked correctly 2. Yess all div and css properties have correct closing tags

I have this div class called entry-title-first then I have entry-title-second and entry-title-third but for some reason all the classes take the style of entry-title-first what is causing this problem? 

.entry-title-first {
color:#fff;
font-family:Trade Gothic;
font-size:28px;
line-height:26px;
margin-top:-15px;
font-weight:900;
padding-bottom:8px;
}

.entry-title-first a:link, a:visited, a:hover{
color:#fff;
text-decoration:none;
}

.entry-title-second {
color:#000;
font-family:Trade Gothic;
font-size:28px;
line-height:26px;
margin-top:-15px;
font-weight:900;
padding-bottom:8px;
}

.entry-title-second a:link, a:visited, a:hover{
color:#000;
text-decoration:none;
}

html

<div class="entry-title-first"><a href="/">Link Name</a></div>
<div class="entry-title-second"><a href="/">Link Name</a></div>

Upvotes: 0

Views: 45

Answers (1)

Asons
Asons

Reputation: 87303

You need to do like this

.entry-title-first a:link, .entry-title-first  a:visited {
  color:#fff;
  text-decoration:none;
}
.entry-title-first a:hover {
  color:#f00;
}

Sample

body {
  background: gray;
}
.entry-title-first {
  color:#000;
  font-family:Trade Gothic;
  font-size:28px;
  line-height:26px;
  margin-top:15px;
  font-weight:900;
  padding-bottom:8px;
}

.entry-title-first a:link, .entry-title-first  a:visited {
  color:#fff;
  text-decoration:none;
}
.entry-title-first a:hover {
  color:#f00;
}

.entry-title-second {
  color:#000;
  font-family:Trade Gothic;
  font-size:28px;
  line-height:26px;
  margin-top:15px;
  font-weight:900;
  padding-bottom:8px;
}

.entry-title-second a:link, .entry-title-second a:visited {
  color:#000;
  text-decoration:none;
}

.entry-title-second a:hover {
  color:#ff0;
}
<div class="entry-title-first"><a href="/">Link Name 1</a></div>
<div class="entry-title-second"><a href="/">Link Name 2</a></div>

Upvotes: 3

Related Questions