Forum Home
Press F1
 
Thread ID: 82338 2007-08-23 21:25:00 HTML/CSS question Tony (4941) Press F1
Post ID Timestamp Content User
584138 2007-08-23 21:25:00 I'm trying to use CSS so that when I mouseover some text it changes colour. What I have basically works, except that if I hover the mouse in certain positions over the text, it alternates rapidly between the two states. If I move the mouse fractionally, the flashing stops and it settles into the "over" state.

I have no idea what is happening.

Any ideas, anyone?
Tony (4941)
584139 2007-08-23 21:34:00 link to example? mejobloggs (264)
584140 2007-08-23 21:38:00 link to example?Not sure how to do that, sorry. Tony (4941)
584141 2007-08-23 21:42:00 Can you post your code? mejobloggs (264)
584142 2007-08-23 21:49:00 I'm using Golive, with inserted CSS stuff. Here it is:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.w3.org

<html lang="en" xml:lang="en" xmlns="www.w3.org

<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="generator" content="Adobe GoLive" />
<title>untitled</title>
<link href="../css/agl-styles.css" rel="stylesheet" type="text/css" media="all" />
<link href="../css/basic.css" type="text/css" rel="stylesheet" media="all" />
<style type="text/css" ><!--
a:link {
color: black;
font-size: 15px;
font-family: Verdana;
}
a:hover {
color: green;
font-size: 15px;
font-family: Arial;
font-style: italic;;
}
.dsR1 /*agl rulekind: base;*/ { width: 380px; height: 127px; }
--></style>
<csscriptdict import="import">
<script type="text/javascript" src="../GeneratedItems/CSScriptLib.js"></script>
</csscriptdict>
<csactiondict>
<script type="text/javascript"><!--
var preloadFlag = false;
function preloadImages() {
if (document.images) {
pre_Anagama_012 = newImage('Anagama-012.jpg');
preloadFlag = true;
}
}

// --></script>
</csactiondict>
</head>

<body onload="preloadImages();">
<table class="dsR1" border="1" cellspacing="2" cellpadding="0">
<tr >
<td>this is some text</td>
</tr>
<tr>
<td><a href="#">This is text</a></td>
</tr>
<tr>
<td><a href="#">this is more text</a></td>
</tr>
<tr>
<td></td>
</tr>
</table>
<p><a href="#">This is text</a></p>
</body>

</html>
Tony (4941)
584143 2007-08-23 21:56:00 Remove the 'font-size: 15px;' in the a:hover

Don't ask me to explain why though :p
mejobloggs (264)
584144 2007-08-23 22:08:00 A bit off topic, but its probably a good idea to change your doctype (alistapart.com) to 'strict', previously discussed here (pressf1.pcworld.co.nz). Greg (193)
584145 2007-08-24 01:13:00 Remove the 'font-size: 15px;' in the a:hover

Don't ask me to explain why though :pThat worked - thanks! Did you find that by experiment, or know already?
Tony (4941)
584146 2007-08-24 01:16:00 A bit off topic, but its probably a good idea to change your doctype (alistapart.com) to 'strict', previously discussed here (pressf1.pcworld.co.nz).Those are a couple of very useful links. What I posted is as generated by Golive9 (plus my link additions), so being an HTML newbie, I assumed it was OK. I think GL is becoming an Adobe orphan product - they certainly seem to be pushing Dreamweaver much more heavily. Tony (4941)
1