On Sunday, August 14, 2011, 11:40:20 PM, John D wrote:
> You could also use inline styles so that the code looks something like this:
> <div id="test" style="background-color: blue; font-size: 62.50%; border: 2px
> black solid;">
> </div>
> Hope you get the idea.
---
Thanks.
Unfortunately, I need the anchors arranged in one horizontal line, so
divs won't work. I did try spans, but the only way that I could get
the desired 'rollover' effect was with Javascript onMouseover and
onMouseout events -- and I'd rather not use Javascript where I can do
something with CSS.
For info, I've reproduced the essential bits of the code below my sig
just in case someone can come up with a way of doing this purely by
inline styles.
Thanks again,
--
Geoff
----------------8<-------------------------------
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
<title>Test Page</title>
</head>
<body>
<p style="text-align:center;font-family:sans-serif;font-weight:bold;">Random
Content</p>
<p style="padding:0 10%;">Lorem ipsum dolor sit amet, consectetur adipiscing
elit.
Aliquam fringilla neque in elit convallis condimentum. Etiam erat magna,
dignissim et
venenatis a, cursus luctus quam. Suspendisse potenti. Nam dignissim elementum
eros ut
rutrum. Aenean commodo congue metus eu mattis. Vestibulum eget lectus a metus
sodales dapibus nec non risus. Pellentesque mollis tellus eu velit luctus
convallis.
Donec lectus orci, lacinia non luctus ac, placerat in lacus. Vestibulum
suscipit
felis et nulla mollis elementum. Proin eget dui in lectus tristique fermentum.
Vivamus
in nisi orci, nec interdum lorem. Proin nec risus dolor. Etiam in nibh libero.
Maecenas
elementum fringilla dictum. Morbi rhoncus mauris dolor. Ut vitae augue nibh, et
cursus
nunc.</p>
<div style="text-align:center;">
<style type="text/css" scoped="scoped">
a.pc:link, a.pc:visited, a.pc:active, a.pc:hover {
padding: 0 20px;
margin: 1px;
text-align: center;
font-family: sans-serif;
font-weight: bold;
color: white;
text-decoration: none;
}
a.pc:link, a.pc:visited {
background-color:#b0b0b0;
}
a.pc:active, a.pc:hover {
background-color:#808080;
}
</style>
<p style="text-align:center">
<a class="pc" href="#">Our Store</a>
<a class="pc" href="#">Shipping</a>
<a class="pc" href="#">Payment</a>
<a class="pc" href="#">Returns</a>
<a class="pc" href="#">About Us</a>
</p>
</div>
</body>
</html>
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
