NetTalk Central

Author Topic: CSS Button Help  (Read 2225 times)

kevin plummer

  • Hero Member
  • *****
  • Posts: 1195
    • View Profile
    • Production Accounting and Software Payroll
CSS Button Help
« on: February 09, 2009, 06:48:50 PM »
I'm having trouble with a new button I have added to my custom CSS file. As you can see from the image, if I use the std button css the text is nice and centered vertically (well almost).

Here is a snipit from my CSS file - is there some property I can set to fix this button. I have used Firebug to inspect the CSS and it looks like it inherits all the normal stuff if I just use the std button css.


.MyMainButton6
{
     width: 130px;
     height: 26px;
     margin: 3px 1px;
     font-family: Tahoma, Verdana,  Arial, Helvetica, sans-serif;
     font-size: 11px;
     cursor: pointer;
     padding: 0px;
}


[attachment deleted by admin]

Bruce

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 11197
    • View Profile
Re: CSS Button Help
« Reply #1 on: February 09, 2009, 10:05:16 PM »
Hi Kevin,

now we get into the realm of the really cunning.

If you look in netweb.css you'll find the original MainButton class, but you'll also find a MainButtonTable class. In order to get everything to line up properly I used a table (_inside_ the button) which uses this class.
the table takes the class of the button & table.

so you class is MyMainButton6, so you need

.MyMainButton6Table {
  font-family: Tahoma, Verdana,  Arial, Helvetica, sans-serif;
  font-size: 11px;
  cursor: pointer;
  padding: 0px;
  margin: 0px;
}

.MyMainButton6Table td {
  font-family: Tahoma, Verdana,  Arial, Helvetica, sans-serif;
  font-size: 11px;
  cursor: pointer;
  padding: 0px;
  margin: 0px;
}

Cheers
Bruce

kevin plummer

  • Hero Member
  • *****
  • Posts: 1195
    • View Profile
    • Production Accounting and Software Payroll
Re: CSS Button Help
« Reply #2 on: February 11, 2009, 04:42:58 AM »
Thanks Bruce, that did the trick - very cunning indeed!