HTML/CSS/IE Firefox/ moz border
Round corner in Firefox
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/xhtml; charset=windows-1252" />
<meta http-equiv="content-language" content="en-us" />
<style type="text/css">
h1 {
padding: 5px;
border-bottom: 5px solid black;
width: 510px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
}
div {
background: gray;
padding: 10px;
width: 500px;
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
clear: left;
}
h2 {
font-size: 11pt;
-moz-border-radius: 10px;
padding: 3px;
}
</style>
</head>
<body>
<h1>This is the title</h1>
<ul id="navigation">
<li><a href="">home</a></li>
<li><a href="">contact us</a></li>
<li><a href="">products</a></li>
<li><a href="">services</a></li>
<li><a href="">faq</a></li>
</ul>
<div>
<h2>faq</h2>
<ul id="top">
<li><a href="#">Q.</a></li>
<li><a href="#">Q.</a></li>
<li><a href="#">Q.</a></li>
<li><a href="#">Q.</a></li>
<li><a href="#">Q.</a></li>
<li><a href="#">Q.</a></li>
</ul>
<h3 id="who">Q. ? <a href="#">top</a></h3>
<p>
This is a test.
</p>
</div>
</body>
</html>
Round form corner
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
h1 {
font-size: 18pt;
padding: 5px;
border-bottom: 5px dashed #fff;
letter-spacing: -2px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
}
form {
background: #aaa;
padding: 10px;
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
}
form h2, form label {
font-size: 11pt;
-moz-border-radius: 10px;
padding: 3px;
}
div input, div textarea {
margin: 3px;
padding: 4px;
background: #ccc;
font-weight: bold;
-moz-border-radius: 10px;
color: black;
}
input#button {
background: black;
font-weight: bold;
-moz-border-radius: 10px;
color: white;
}
</style>
<title>Feedback Form</title>
</head>
<body>
<h1>Header 1</h1>
<form>
<h2>This is the title.</h2>
<div>
<label for="feedback[name]">Name:</label>
<input type="text" size="25" name="feedback[name]" />
</div>
<div>
<label for="feedback[email]">Email:</label>
<input type="text" size="25" name="feedback[email]" />
</div>
<div class="spanform">
<label for="feedback[message]" class="spanform">Comments:</label>
<textarea name="feedback[message]" cols="40" rows="6" wrap="virtual"></textarea>
</div>
<div id="buttons">
<input type="submit" name="feedback[action]" value="Submit" id="button" />
</div>
<div id="copyright">
© Copyright 2008, All Rights Reserved.
</div>
</form>
</body>
</html>