I have a style sheet linked to my html doc which has the following:
td, th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
line-height: 12px;
color: #000000;
}
further down in my html I have a table where I'm dynamically creating a button using javascript. This button's text is aligned to the top of the button and not centered and its due to the td,th style specified above. My problem is that I don't know how to inform the dynamic button that its not to use the style but to ignore it. Is there a way to bypass the style for a given control? or is there a more specific style that I could write for the button itself telling it to vertically center the text? Any help would be appreciated. The following is the dynamic button:
<td width='80%'>
<div>
<script type="text/javascript">
<!--
document.write('<button>Check All</button>');
document.forms[0].elements[document.forms[0].elements.length-1].onclick =
function ()
{
var checked = this.firstChild.data == 'Check All';
for (var i = 0; i < this.form.elements.length; i++) {if (this.form.elements.type == 'checkbox') this.form.elements.checked = checked};
this.firstChild.data = this.firstChild.data == 'Check All' ? 'Clear All' : 'Check All';
}
// -->
</script>
</div>
</td>If you assign a class to your button (e.g. <button class="myButton">) you can then override the style only for members of the class like this:
.myButton { some-css-selector: value }
AdamDefine a style for the <div> tag to align it. You can do it within your HTML, or your style sheet.
<div style="text-align:center;">
or
<div id="jsButton">
with this code in your CSS file
#jsButton { text-align:center; }Thanks to both of you. Its working.
td, th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
line-height: 12px;
color: #000000;
}
further down in my html I have a table where I'm dynamically creating a button using javascript. This button's text is aligned to the top of the button and not centered and its due to the td,th style specified above. My problem is that I don't know how to inform the dynamic button that its not to use the style but to ignore it. Is there a way to bypass the style for a given control? or is there a more specific style that I could write for the button itself telling it to vertically center the text? Any help would be appreciated. The following is the dynamic button:
<td width='80%'>
<div>
<script type="text/javascript">
<!--
document.write('<button>Check All</button>');
document.forms[0].elements[document.forms[0].elements.length-1].onclick =
function ()
{
var checked = this.firstChild.data == 'Check All';
for (var i = 0; i < this.form.elements.length; i++) {if (this.form.elements.type == 'checkbox') this.form.elements.checked = checked};
this.firstChild.data = this.firstChild.data == 'Check All' ? 'Clear All' : 'Check All';
}
// -->
</script>
</div>
</td>If you assign a class to your button (e.g. <button class="myButton">) you can then override the style only for members of the class like this:
.myButton { some-css-selector: value }
AdamDefine a style for the <div> tag to align it. You can do it within your HTML, or your style sheet.
<div style="text-align:center;">
or
<div id="jsButton">
with this code in your CSS file
#jsButton { text-align:center; }Thanks to both of you. Its working.