SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Zealot
    Join Date
    Jan 2004
    Location
    GA
    Posts
    104
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Microsoft - button

    Hi,

    Anyone here know ,how to make button like in the www.microsoft.com. When u move mouse over the button it is covered with white border .

    Please advice !

  2. #2
    American't awestmoreland's Avatar
    Join Date
    Sep 2002
    Location
    Grand Rapids, MI
    Posts
    1,168
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I can guarantee you that this works in IE6, but it will need testing in other browsers. I know for example that some of the border/padding CSS properties may not be supported or interpretted in exactly the same way in NS:

    DEMO
    Code:
    <html>
    <head>
    	<style type="text/css">
    	<!--
    	 body{
    		background-color: #2178D4;
    		}
    	 #button1 a{
    		background-color: #2178D4;
    		border: solid 1px #2178D4;
    		color: white;
    		font-family: courier;
    		text-decoration: none;
    		padding: 5px;
    		}
    	 #button1 a:hover{
    		background-color: #3484D7;
    		border: solid 1px #A1C6EB;
    		}		 
    	-->
    	</style>
    </head>
    <body>
    	<div id="button1">
    	 <a href="http://www.microsoft.com">Microsoft.com Home</a>
    	</div>
    </body>
    </html>

    Andy

    EDIT: Demo URL corrected
    From the English nation to a US location.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •