Text Class Properties on CSS Not Working!

Question

Hi everybody, I've got a text class where I haven’t defined a font family or size because your want the default font and size. I’ve just defined a colour. However, on this class other code to control the link colours doesn’t work. On the other class which does have a font family and size defined “.Venue” the code below in dark red controls the link colour, hover mouse over, click down and visited link colours.

.Venue {
font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
font-size: 20px;
color: #999999;
}
.Venue a:link{
font-weight: bold;
color: #999;
}
.Venue a:visited{
color: #999;
}
.Venue a:hover{
color: #666;
}
.Venue a:active{color: #FFFFCC;}
.Venue a:focus{color: #FFFFCC;} /**adjust colors to suit**/

However, with the class “.Date” that doesn’t have a font family and size defined all that code doesn’t do anything! As well as that without the extra code the normal link settings that apply to the rest of the page don’t work either. As you can see in the linked file, the default colours only apply to the line under the text! This makes our band look very incompetent! Can anybody help? Thanks.

.Date {
color: #999999;
}

Here is the file … http://www.maximum-robot.co.uk/live.html

osgood_ · Accepted Answer

Thanks Ben, I can’t work out the point you’re making from the pictures. I guess I’m missing something pretty obvious! I’ve uploaded the file again without the link and taken the bold off to avoid any extra complications. I’ve also turned the table white so I can see what I’m doing in DW! Would anybody know what I would need to do to control the link properties on that text with the class “.Date”? The other two classes with links “.Venue” and “.Support Band” are controlled by the dark red code above. Thanks again for your help.

http://www.maximum-robot.co.uk/live3.html

Would anybody know what I would need to do to control the link properties on that text with the class “.Date”?

By @Gareth_Williams

Well you would move the class name 'Date' from the span tag to the td cell that the link tag is in, exactly like you have for Venue.

<td align="center" valign="top" class="Date" style="white-space: nowrap; color: #999999;"><a href="https://railwayinn.pub/shows/maximum-robot-2024-07-02" target="_blank"><strong><span style="white-space: nowrap">24th of September 2024</span></strong></a></td>

Then you can do what you like to style the link:

.Date a {
color: pink;
}
.Date a:hover {
color: orange;
}

Nancy OShea · Answer

You should be sleuthing out styles with your browser's Inspect Element (F12) panel by now.Firefox and Chrome both have one.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded