What happened to the Messenger Plus! forums on msghelp.net?
Shoutbox » MsgHelp Archive » Skype & Technology » Tech Talk » css button thing

css button thing
Author: Message:
Supersonicdarky
Veteran Member
*****

Avatar

Posts: 2317
Reputation: 48
– / – / Flag
Joined: Feb 2005
Status: Away
O.P. css button thing
i'm using css to put text on top of image to make button, but i can't align the text exactly in the middle vertically or horisontally

what i have:

--------
|   text |
|          |
|______|

what i want:

--------
|          |
|  text  |
|______|

source:

code:
    #menu {
    width: 70%;
    height: 25px;
    border-bottom: 1px none #5b5b5b;
    padding-left: 25px;
    }
   
    #menu li {
    display: inline;
    }
   
    #menu a {
    width: 70px;
    height: 25px;
    background-image:url('button1.jpg');
    text-align: center;
    font-family: Arial;
    font-style: bold;
    color: white;
    display: block;
    float: left;
    font-size: 15px;
    padding:0 2px 0 2px;
    background-repeat: no-repeat;
    }
   
    #menu a:hover {
    width: 70px;
    height: 25px;
    background-image:url('button2.jpg');
    background-repeat: no-repeat;
    text-align: center;
    font-family: Arial;
    font-style: bold;
    color: white;
    display: block;
    float: left;
    font-size: 15px;
    padding:0 2px 0 2px;
    }

and

code:
<div id="menu" align="center">
<ul>
<li><a href="#">Test</a></li>
<li><a href="#">Test</a></li>
<li><a href="#">Test</a></li>
</ul>
</div>

help?
03-29-2006 01:00 AM
Profile E-Mail PM Find Quote Report
hmaster
Senior Member
****

Avatar

Posts: 716
Reputation: 24
33 / Male / Flag
Joined: Nov 2004
RE: css button thing
vertical-align:middle; should work *-)
http://www.w3schools.com/css/pr_pos_vertical-align.asp
[Image: sig.png]
03-29-2006 06:42 AM
Profile PM Web Find Quote Report
RaceProUK
Elite Member
*****

Avatar

Posts: 6073
Reputation: 57
39 / Male / Flag
Joined: Oct 2003
RE: css button thing
text-align: center;
vertical-align: middle;
in '#menu a'

BTW: in '#menu a:hover', you don't need to repeat everything in '#menu a' that doesn't change.
[Image: spartaafk.png]
03-29-2006 11:55 AM
Profile PM Web Find Quote Report
« Next Oldest Return to Top Next Newest »


Threaded Mode | Linear Mode
View a Printable Version
Send this Thread to a Friend
Subscribe | Add to Favorites
Rate This Thread:

Forum Jump:

Forum Rules:
You cannot post new threads
You cannot post replies
You cannot post attachments
You can edit your posts
HTML is Off
myCode is On
Smilies are On
[img] Code is On