• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 220
  • Last Modified:

Unable to change font on button text in style attribute

I seem to have this problem sometimes when I use the style attribute in an html button.
I'm using Internet Explorer 6.

Here's my code:

<td align=center bgcolor="red"><input style="BACKGROUND-COLOR: red;color: white;font-weight: bold;font: smallcaption;cursor: hand,border:1px solid;" type="submit" name="SubmitAccessFrom" value="Enter the System">

I'm not sure but the font by default seems to be Times New Roman by the looks of it.
I want to make it Arial or Comic sans sometingorother so I add the font-face name-value pair to the style attribute like this:

<input style="BACKGROUND-COLOR: red;color: white;font-face:Arial;font-weight: bold;font: smallcaption;cursor: hand,border:1px solid;" type="submit" name="SubmitAccessFrom" value="Enter the System">

which does nothing everytime I try it.

The other attribute, cursor: hand; doesn't work either.

I have been able to change the font in a button style before but when I mix more than a couple attributes I seem to have these problems.
1 Solution
For that, use something like


As for your cursor:hand not working, it's because after the hand, you have a comma, not a semicolon. Another tip for compatibility on all browsers is to use both cursor:hand and cursor:pointer, so have cursor:pointer;cursor:hand
<input style="font: 0.8em/100% arial, sans-serif; background: #F00; color: #FFF; cursor: hand; border: 1px solid #000;" type="submit" value="Enter the System" name="SubmitAccessForm" />

Try that :)
Hi jumprooster,

You can also take it out if the table and not use inline CSS:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<style type="text/css">
.divcenter {text-align:center;margin:0 auto;}
input {font: 1em arial, sans-serif; font-weight:bold; background: #F00; color: #FFF; cursor:pointer; cursor:hand; border: 1px solid #000;}
<div class="divcenter">
<input type="submit" value="Enter the System" name="SubmitAccessForm">
its not 'input style' anyway in a form element for a buttun it is submit in css to change the style of all form buttons for example to a button it would look like something along these lines....

select {font-size:11px;  border: 1px dotted #669900; color:#669900; font-weight:bold;}

where select is the button if that makes sense
also by doing this you can do what Daydreams has stated and not use a table. table are only not used for layout thats a job for css.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: CompTIA Healthcare IT Tech

This course will help prep you to earn the CompTIA Healthcare IT Technician certification showing that you have the knowledge and skills needed to succeed in installing, managing, and troubleshooting IT systems in medical and clinical settings.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now