Microsoft - button

**rider_2004** · Feb 1, 2004 23:03

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 !

**awestmoreland** · Feb 2, 2004 05:24

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

User Tag List

Thread: Microsoft - button

Thread Tools

Display

Microsoft - button

Bookmarks

Bookmarks

Posting Permissions