Jump to content

p:first-letter discrepancy for links


cybl

Recommended Posts

OverviewI'm using p:first-letter in order to make the first letter of every paragraph unique. However, when the paragraph is just a link, a problem that I don't know how to fix occurs.In Firefox, the link starts out with the unique letter, but when hovered over, the unique letter returns to the normal size of 1.2em; it also remains the normal size after hovering off. In IE, the unique letter remains the same whether I hover or not. I need to figure out a way to make it consistent between browsers, whether the link contains the unique letter (such as it does in IE) or no unique letter at all while maintaining the unique letter for text. The only thing I could think of was: a:first-child {font-size: 1.2em; font-weight: normal;} but it didn't work.I've included the portion of CSS that the problem lies. I cannot post the full website as it is an internal site where I work and I'd need my supervisor's permission to do so (and she left for the weekend). PERTINENT CSS SECTION:

#content {	float: right;	margin: 10px 25px 0px 0px;	background-color:transparent;	color: #666666;	width: 425px;	padding: 0px;	text-align: left;	font-size: 1.2em;	line-height: 17px;	}		#content p:first-letter {		font-size: 1.3em;		font-weight: bold;		}			#content a:link {		color: #5c743d;		border-bottom: 1px dashed #5c743d;		text-decoration: none;		}			#content a:visited {		color: #993300;		border-bottom: 1px dashed #993300;		text-decoration: none;		}			#content a:hover {		color: #000000;		border-bottom: 1px dashed #000000;		text-decoration: none;		}

PERTINENT HTML SECTION:

<p><a href="link">Link</a></p>

If any of you have any suggestions or a tutorial you can direct me to that would be awesome. I wasn't able to find anything specific to my problem.Thanks in advance!Cybl

Link to comment
Share on other sites

  • 2 weeks later...

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...