|
Posted by Jonathan N. Little on 09/25/07 18:22
Jim S wrote:
> OK I'm nearly there.
> Using a different stylesheets for one-line and two-line buttons I have
> got to this http://priorysingers.org.uk/testingIndex_1.html
> It works fine in IE, but not in Firefox or Opera.
Well I would avoid "position: absolute" if I were you, can get you into
trouble. Personally your links are in a list so I would use a list!
You just set their width and if your want the links centered vertically
you can tweak the single line links...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="content-language" content="en-us">
<title>template</title>
<style type="text/css">
ul.buttonbar {
font: .8em/1.4 sans-serif; list-style: none; width: 8em;
}
ul.buttonbar li {
margin: 1px; height: 3em; background-color: #ccc;
border: 3px outset #ccc;
}
ul.buttonbar a {
display: block; text-align: center; text-decoration: none;
}
/* tweak the single lines links */
ul.buttonbar a.singles { margin-top: .65em; }
</style>
</head>
<body>
<ul class="buttonbar">
<li><a class="singles"href="#">Home</a></li>
<li><a class="singles" href="#">About Us</a></li>
<li><a href="#">Current Programme</a></li>
<li><a href="#">Contacts & Information</a></li>
<li><a href="#">Become a Patron</a></li>
<li><a href="#">Past Performances</a></li>
<li><a class="singles" href="#">About our Area</a></li>
</ul>
</body>
</html>
--
Take care,
Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
[Back to original message]
|