#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2003
    Posts
    124
    Rep Power
    12

    Change colour of input on focus


    Hi I want to change the font colour of an input field when the mouse enters it.

    http://www.des-otoole.co.uk/yorknightlife/

    Style sheet contents
    Code:
    *
    {
     	padding: 0;
     	margin: 0px;
    }
    
    body
    {
    	BACKGROUND-IMAGE: url(greynoise2.jpg);
     	font-family: Arial;
     	font-size: 12px;
     	color: #000000;
    }
    
    h1, h2, h3, h4, h5, h6
    {
     color: #aa8800;
    
    }
    
    input[type="input"]:focus, input[type="password"]:focus, input[type="text"]:focus, textarea:focus 
    {
        background:red;
        color:blue;
    	Font:Bold;
    }
    
    a:link 
    {
       	color: #0000ff; 
       	text-decoration: underline; 
    }
     /* aa8800 */
    a:active 
    {
       color: #0000ff; 
       text-decoration: underline; 
    } /* 0000ff */
    
    a:visited 
    {
       	color: #0000ff; 
    	text-decoration: underline; 
    } /* aa8800 */
    
    
    a:hover 
    {
       color: #ff0000; 
    	 text-decoration: underline;
    	 /* background: #cccccc; */
    } /* ff0000 */
    
    .HiLight
    {
     color:blue;
     font-weight:bold;
    }
    
    .TableClass
    {
      border:2px solid black;
    	border-collapse:collapse;
    	/* cellpadding:10px; */
    }
    
    #PageTitle
    {
    	height:100px;
    	width:1000px;
    	background-color:blue;
    }
    
    #thebody
    {
    	height:800px;
    	width:1000px;
    }
    
    #margin
    {
    	float:left;
    	height:800px;
    	width:10px;
    	background-color:green;
    }
    
    #PageContent
    {
    	float:left;
    	padding-left:12px;
    }
    This code has been used else where !
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2003
    Posts
    124
    Rep Power
    12
    Sorry ignore this. I have seen what the problem was.
  4. #3
  5. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,131
    Rep Power
    4304
    So what was your solution? Do you mean that you needed to use ":hover" in addition to ":focus"?

    By the way, "Font:Bold;" is not valid. The font shorthand property requires values for font-size and font-family. Use "font-weight:Bold;" instead.
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).

IMN logo majestic logo threadwatch logo seochat tools logo