Hey all, I've used CSS before to create "button" style links, for
example:
a.buttonLink
a:link.buttonLink
a:visited.buttonLink,
a:active.buttonLink,
a:hover.buttonLink {
border:1px solid #333333;
padding:5px;
color:#333333;
background-color:#dddddd;
margin-left:5px;
margin-right:5px;
cursor:pointer;
}
a:hover.buttonLink {
color:#000000;
border-color:#000000;
background-color:#ffffff;
}
Unfortunately I usually have to hack the padding or margins or
something in the containing element to get layouts to look right.
So really you just get a link in a box. But the problem I'm having
is in figuring out how to get an inline element like that to "grow"
in a way that doesn't obstruct text in lines above or below it. I'm
not really interested in using them inside of paragraphs or anything,
but if, for example, I have a section of content with a set of
bordered links at the bottom, sometimes the links will obstruct the
bottom of the content above it. If it were just me designing, I
could place them in a div & set properties on that div, but the
problem is that this is part of an automated system where an end user
(many of whom have zero knowledge of even basic HTML) can produce
content, adjust font sizes, etc... so they can potentially show up
anywhere and with any font size. It leads to some rather ugly pages,
but that ability is what they pay us to provide. So I'm really
looking for some kind of solution that will let me take this button
styled link & place it anywhere, with any font size, and have the
content around it move to make room.
The best I've managed to work out is maybe playing with line-height.
Is that the right direction to go or is there some other better, more
reliable, way?
Thanks so much for any help or advice,
Cliff
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
