<style> tag issues

[tmcneil]

I found some code that creates a scrollable table that is formatted using a <style> tag. The problem is, the <style> tag formats other tags on the page that I do not want it to. I only want it to format the scrollable table. Is there a way around it to get it to do what I want?

<style>
    table {
        text-align: left;
        font-size: 12px;
        font-family: verdana;
        background: #c0c0c0;
        }

    table thead  {
        cursor: pointer;
        }

    table thead tr,
    table tfoot tr {
        background: #c0c0c0;
        }

    table tbody tr {
        background: #f0f0f0;
        }

    td, th {
        border: 1px solid white;
        }
</style>

Thanks,
Todd

 

[johnwm]

Use a class for the table you want formatted differently. See

http://www.w3schools.com/css/css_syntax.asp

for details

If you want the best response to a question, please check out FAQ222-2244 first.
'If we're supposed to work in Hex, why have we only got A fingers?'
Drive a Steam Roller

 

[tmcneil]

Thanks johnwm,

I was able to use that link and figure it out to get it to do what I want.

<style type="text/css">
    table.scrollTable {
	text-align: left;
	font-size: 12px;
	font-family: verdana;
	background: #c0c0c0;
        }

    table.scrollTable thead.tHead  {
	cursor: pointer;
	}
    
    table.scrollTable thead.tHead tr.tR,
    table.scrollTable tfoot.tFoot tr.tR {
	background: #c0c0c0;
	}

    table.scrollTable tbody.tBody tr.tR {
	background: #f0f0f0;
	}

    table.scrollTable tbody.tBody tr.tR td.tD,
    table.scrollTable thead.tHead tr.tR th.tH {
	border: 1px solid white;
	}
</style>

Thanks and I just learned something new today.
Todd

 

[ChrisHunt]

You don't have to add a class to everything, just the <table> should be enough:

    table.scrollTable {
        text-align: left;
        font-size: 12px;
        font-family: verdana;
        background: #c0c0c0;
        }

    table.scrollTable thead  {
        cursor: pointer;
        }

    table.scrollTable thead tr,
    table.scrollTable tfoot tr {
        background: #c0c0c0;
        }

    table.scrollTable tbody tr {
        background: #f0f0f0;
        }

    table.scrollTable td, table.scrollTable th {
        border: 1px solid white;
        }

For example, the last rule applies a white border to <th> and <td> elements only when they are within a <table class="scrollTable"> element.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd