-
1. Re: table header not styling
John Waller Jul 12, 2014 6:52 PM (in response to broomeGirl)Let me know if you need the url.
Yes please.
-
2. Re: table header not styling
mytaxsite.co.uk Jul 12, 2014 6:55 PM (in response to broomeGirl)I tried your code and it works on my machine: This is the code I created on my machine:
<!DOCTYPE html>
<html><head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Untitled 1</title>
<style media="all" type="text/css">
th {
font: 1.4em "Helvetica Neue", Helvetica, Arial, sans-serif;
text-decoration: underline;
color: #ff0000;
}
</style>
</head><body>
<table border="0" cellpadding="10" cellspacing="10" summary="Rates for ???? bike hire for both geared and kids bikes." width="400">
<caption>Bike Hire </caption>
<tr>
<th scope="col">Geared Bikes</th>
<th scope="col"></th>
<th scope="col">Kids Bikes</th>
<th scope="col"></th>
</tr>
<tr>
<td>1 day</td>
<td>$24</td>
<td>1 day</td>
<td>$14</td>
</tr>
</table></body>
</html>
And this is what I see in the browser:
Hope this helps.
-
3. Re: table header not styling
broomeGirl Jul 12, 2014 7:56 PM (in response to mytaxsite.co.uk)Thanks to both of you! So strange, I have tested in both Firefox and Safari and yet the table headers remain unstyled. This is the url: http://bit.ly/1m5AjFKhttp://
I would have thought that any other inherited styling would have been over-ridden by the important tag.
This is what I see
-
4. Re: table header not styling
mytaxsite.co.uk Jul 12, 2014 8:13 PM (in response to broomeGirl)There is a problem in your style code. This code isn't correct:
table tbody tr th {
font: 1.4em "Helvetica Neue", Helvetica, Arial, sans-serif!important;
text-decoration:underline!important;
color:#ff0000!important;}
I would just change it to:
th {
font: 1.4em "Helvetica Neue", Helvetica, Arial, sans-serif!important;
text-decoration:underline!important;
color:#ff0000!important;}
Good luck.
-
5. Re: table header not styling
mytaxsite.co.uk Jul 12, 2014 8:19 PM (in response to broomeGirl)!important is to over-ride any specificity you might have on the page. For example, you might have something like this:
#example {
font-size: 14px !important;
}
#container #example {
font-size: 10px;
}In the absence of !important, the font size will be 10px for a div called ID example but by using !important, the second declaration CAN'T over-ride the first. In normal cases that is what happens but in this case it can't because of the word !important. I hope you get the idea.
-
6. Re: table header not styling
mytaxsite.co.uk Jul 12, 2014 8:33 PM (in response to broomeGirl)This article explains better:
<http://css-tricks.com/when-using-important-is-the-right-choice/>
Good luck.
-
7. Re: table header not styling
broomeGirl Jul 13, 2014 2:43 AM (in response to mytaxsite.co.uk)Thanks for all your responses. I know what important does, this is not the problem and the above code was changed back to th .. I was just trying to be really really specific but I knew just th would do it.
I just cant work out why it is not working.
It should be straight forward.
-
8. Re: table header not styling
broomeGirl Jul 13, 2014 2:46 AM (in response to broomeGirl)YAY! I found it .. there was a semi colon after the last css statement
caption {
padding:0 0 10px 0;
font: 2em "Helvetica Neue", Helvetica, Arial, sans-serif;
color:#77ff23;};
th {
font: 1.4em "Helvetica Neue", Helvetica, Arial, sans-serif!important;
text-decoration:underline!important;
color:#ff0000!important;}
Thanks all for trying!
-
9. Re: table header not styling
MurraySummers Jul 13, 2014 6:05 AM (in response to broomeGirl)A misplaced semicolon like that spoils everything else below as you discovered. The very specific selector you originally specified for the th style should have worked fine assuming all of your tables contain a <tbody> tag, and that you have removed the extra semicolon.
-
10. Re: table header not styling
broomeGirl Jul 13, 2014 8:22 PM (in response to MurraySummers)Yep knew it was something I did stupid like the colon. Thanks for your support, very much appreciated!






