467,075 Members | 951 Online
Bytes | Developer Community
Ask Question

Home New Posts Topics Members FAQ

Post your question to a community of 467,075 developers. It's quick & easy.

is there such an animal as er... text background width?

I like some css anchor to button stuff posted by someone a while back,
but want the buttons to be the same width. How can I get the anchor
for 'test' and 'longerTest' to be the same width when displayed?
CSS= <style type="text/css>
..button:link, .button:visited {
color: ButtonText;
font: ButtonText;
background-color: ButtonFace;
padding: 3px 15px;
font: small-caption;
border: outset 1px;
cursor: default;
text-decoration: none;
}
..button:active {
border-style: inset;
}
..button:hover {
border: outset 2px;
padding: 3px 15px;
}
</style>HTML=

<a href="./index.php?screen=test" class="button">test</a><br />
<a href="./index.php?screen=longerTest"
class="button">longerTest</a><br />
Jul 20 '05 #1
  • viewed: 6184
Share:
8 Replies
In article <33**************************@posting.google.com >, bg342
@yahoo.com says...
I like some css anchor to button stuff posted by someone a while back,
but want the buttons to be the same width. How can I get the anchor
for 'test' and 'longerTest' to be the same width when displayed?
CSS=
<style type="text/css>
.button:link, .button:visited {

What's this? color: ButtonText; and this: font: ButtonText; and this?? background-color: ButtonFace;
padding: 3px 15px; this? font: small-caption;
border: outset 1px; .... <a href="./index.php?screen=test" class="button">test</a><br />
<a href="./index.php?screen=longerTest"
class="button">longerTest</a><br />


Something like:

..buttons a:link,
..buttons a:visited {
background: #DDD;
border: outset 2px black;
color: black;
display: block;
margin: 3px;
padding: 3px 15px;
text-decoration: none;
width: 10em;
}
..buttons a:active {
border-style: inset;
}
..buttons a:hover {
border: outset 2px #AAA;
background: #EEE;
}

<div class="buttons">
<a href="./index.php?screen=test">test</a>
<a href="./index.php?screen=longerTest">longerTest</a>
</div>

Jul 20 '05 #2
Jacqui or (maybe) Pete <po****@spamcop.net> wrote in message news:<MP***********************@news.CIS.DFN.DE>.. .
In article <33**************************@posting.google.com >, bg342
@yahoo.com says...
I like some css anchor to button stuff posted by someone a while back,
but want the buttons to be the same width. How can I get the anchor
for 'test' and 'longerTest' to be the same width when displayed?
>>CSS=

<style type="text/css>
.button:link, .button:visited {

What's this?
color: ButtonText;

and this:
font: ButtonText;

and this??
background-color: ButtonFace;
padding: 3px 15px;

this?
font: small-caption;
border: outset 1px;

...
<a href="./index.php?screen=test" class="button">test</a><br />
<a href="./index.php?screen=longerTest"
class="button">longerTest</a><br />


Something like:

.buttons a:link,
.buttons a:visited {
background: #DDD;
border: outset 2px black;
color: black;
display: block;
margin: 3px;
padding: 3px 15px;
text-decoration: none;
width: 10em;
}
.buttons a:active {
border-style: inset;
}
.buttons a:hover {
border: outset 2px #AAA;
background: #EEE;
}

<div class="buttons">
<a href="./index.php?screen=test">test</a>
<a href="./index.php?screen=longerTest">longerTest</a>
</div>


....>>>Thanks but, No, adding the width:10em; does nothing!
Jul 20 '05 #3
In article <33**************************@posting.google.com >, bg342
@yahoo.com says...
Jacqui or (maybe) Pete <po****@spamcop.net> wrote in message news:<MP***********************@news.CIS.DFN.DE>.. .
In article <33**************************@posting.google.com >, bg342
@yahoo.com says...
I like some css anchor to button stuff posted by someone a while back,
but want the buttons to be the same width. How can I get the anchor
for 'test' and 'longerTest' to be the same width when displayed?
>>>CSS=

snip non-css
Something like:
.... snip working example
...>>>Thanks but, No, adding the width:10em; does nothing!


No, it wouldn't. You can't set width on an inline element (padding &
margin are fine). That's why I did a bit more than "add width:10em".

See:

http://porjes.haxorz.org/one.html

Jul 20 '05 #4
Jacqui or (maybe) Pete <po****@spamcop.net> wrote in message news:<MP************************@news.CIS.DFN.DE>. ..
In article <33**************************@posting.google.com >, bg342
@yahoo.com says...
Jacqui or (maybe) Pete <po****@spamcop.net> wrote in message news:<MP***********************@news.CIS.DFN.DE>.. .
In article <33**************************@posting.google.com >, bg342
@yahoo.com says...
> I like some css anchor to button stuff posted by someone a while back,
> but want the buttons to be the same width. How can I get the anchor
> for 'test' and 'longerTest' to be the same width when displayed?
> >>>CSS=
snip non-css
Something like:

... snip working example

...>>>Thanks but, No, adding the width:10em; does nothing!


No, it wouldn't. You can't set width on an inline element (padding &
margin are fine). That's why I did a bit more than "add width:10em".

See:

http://porjes.haxorz.org/one.html


Got it...thanks a million.
Jul 20 '05 #5
"Jacqui or (maybe) Pete" <po****@spamcop.net> wrote in message >
.... snip ...

...>>>Thanks but, No, adding the width:10em; does nothing!


No, it wouldn't. You can't set width on an inline element (padding &
margin are fine). That's why I did a bit more than "add width:10em".


If you want them left-to-right on one line, add "float:left" to the style.

Jul 20 '05 #6
Jacqui or (maybe) Pete <po****@spamcop.net> writes:
What's this?
color: ButtonText;

A CSS2 system color name.
and this:
font: ButtonText;

An error; congratulations. :)
and this??
background-color: ButtonFace;

A CSS2 system color name.
this?
font: small-caption;


A CSS2 system font name.

--
<!DOCTYPO html>
Jul 20 '05 #7
In article <3f********@10.10.0.241>, st***********@compuware.com says...
"Jacqui or (maybe) Pete" <po****@spamcop.net> wrote in message >
... snip ...

...>>>Thanks but, No, adding the width:10em; does nothing!


No, it wouldn't. You can't set width on an inline element (padding &
margin are fine). That's why I did a bit more than "add width:10em".


If you want them left-to-right on one line, add "float:left" to the style.

Well, he had a <br> between them so I figure he didn't !
Jul 20 '05 #8
In article <m3************@email.bednarz.nl>, do********@wanadoo.nl
says...
Jacqui or (maybe) Pete <po****@spamcop.net> writes:
What's this?
color: ButtonText;


A CSS2 system color name.

Quite right - thank you for the correction.
Jul 20 '05 #9

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

6 posts views Thread by no0bodyhome@nowhere.com | last post: by
4 posts views Thread by anatushi@hotmail.com | last post: by
4 posts views Thread by lindsey.crocker@celltalk.co.uk | last post: by
2 posts views Thread by george.leithead@gmail.com | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.