CSS tables and no border

nope, the borders are still there

http://www.frederikvig.com/temp/test.htm

If it works there then why doesn;t it work for me?

Sorted, My browser was gettinga cached version and not reloading.

Thanks very much!

Regards,
Neil

No idea :). Tried copying the css from the page I posted? Sure your html and css code is the same?

Read my last post

No problem :).

Just been adding the "class=“noborder” to a couple of my tables where I want the table to ahve no borders whatsoever and I added it to the table on the following page and the borders of the tr’s and td have gone but the one around the main table is still showing. How can i sort this? as the other table on the other page whcih I posted before still works perfectly?



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<!--Favicon Link-->
<link rel="shortcut icon" href="favicon.ico" >
<!--------------------->

<!--Meta Tags-->
<!--Meta Tags-->
<meta name="classification" content="Entertainment" />
<meta name="description" content="Alton Towers Mania, a great resource about the UK's number 1 theme park, Alton Towers." />
<meta name="MSSmartTagsPreventParsing" content="TRUE" />
<meta name="keywords" content="alton towers, towers street, merrie england, katanga canyon, gloomy wood, forbidden valley, old macdonalds farmyard, storybook land, adventure land, x-sector, the towers, fountain square, ug land, the gardens, splash landings hotel, alton towers hotel, waterpark, cariba creek, teacups, the flume, splash kart challenge, congo river rapids, runaway mine train, duel, haunted house, thunderlooper, nemesis, blade, ripsaw, air, ribena berry bish bash, doodle doo derby, riverbank eye spy express, squirrel nutty ride, spinball whizzer, beastie, oblivion, enterprise, submission, black hole, hex, legend of the towers, rita, queen of speed, corkscrew, the, ug swinger, bone shaker, 1001 nights, charlie and the chocolate factory, toyland tours, peugeot, driving school, family days out, staffordshire, alton, jcb, farley, ride tracker, news, electric towers, chocolate towers, 207, Bolliger &amp; Mabilard, Intamin, Huss, Days out, extraordinary, flying machine, carribean, halloween, summer, lake, thrilling, adrenaline, hogs head, grill, ride tracker, forums, roller coasters, themeparks, amusement parks, days out, alton, towers, castle, ghost, hunt" />
<meta name="robots" content="ALL" />
<meta name="rating" content="Safe For Kids" />
<meta name="author" content="Neil Tonge" />
<meta http-equiv="reply-to" content="rctneil@aol.com" />

<!--<meta http-equiv="Page-Exit" content="progid:DXImageTransform.Microsoft.Fade(duration=2,overlap=0);" />--><!--------------------->

<!--Stylesheet Links-->
<link href="stylesheets/reset_styles.css" rel="stylesheet" type="text/css" />
<link href="stylesheets/layout.css" rel="stylesheet" type="text/css" />
<link href="stylesheets/navigation.css" rel="stylesheet" type="text/css" />
<link href="stylesheets/misc.css" rel="stylesheet" type="text/css" />
<link href="stylesheets/tabs.css" rel="stylesheet" type="text/css" />
<!--------------------->

<!--Javascript includes for prototype tab script-->
<script src="tabs/prototype.js" type="text/javascript"></script>
<script type="text/javascript" src="tabs/fabtabulous.js"></script>
<!--------------------->

<!--Block of Javascript for drop down parts-->
<script type="text/javascript">
function toggle( targetId ){
if (document.getElementById){
target = document.getElementById( targetId );
if (target.style.display == "none"){
target.style.display = "";
} else {
target.style.display = "none";
}
}
}
</script>
<!--------------------->


<!--Block of javascript for hint boxes-->
<script type="text/javascript">	
var horizontal_offset="9px" //horizontal offset of hint box from anchor link

/////No further editting needed

var vertical_offset="0" //horizontal offset of hint box from anchor link. No need to change.
var ie=document.all
var ns6=document.getElementById&&!document.all

function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function clearbrowseredge(obj, whichedge){
var edgeoffset=(whichedge=="rightedge")? parseInt(horizontal_offset)*-1 : parseInt(vertical_offset)*-1
if (whichedge=="rightedge"){
var windowedge=ie && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-30 : window.pageXOffset+window.innerWidth-40
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure+obj.offsetWidth+parseInt(horizontal_offset)
}
else{
var windowedge=ie && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetHeight
}
return edgeoffset
}

function showhint(menucontents, obj, e, tipwidth){
if ((ie||ns6) && document.getElementById("hintbox")){
dropmenuobj=document.getElementById("hintbox")
dropmenuobj.innerHTML=menucontents
dropmenuobj.style.left=dropmenuobj.style.top=-500
if (tipwidth!=""){
dropmenuobj.widthobj=dropmenuobj.style
dropmenuobj.widthobj.width=tipwidth
}
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+obj.offsetWidth+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+"px"
dropmenuobj.style.visibility="visible"
obj.onmouseout=hidetip
}
}

function hidetip(e){
dropmenuobj.style.visibility="hidden"
dropmenuobj.style.left="-500px"
}

function createhintbox(){
var divblock=document.createElement("div")
divblock.setAttribute("id", "hintbox")
document.body.appendChild(divblock)
}

if (window.addEventListener)
window.addEventListener("load", createhintbox, false)
else if (window.attachEvent)
window.attachEvent("onload", createhintbox)
else if (document.getElementById)
window.onload=createhintbox
</script>
<!--------------------->



<!--Set the page title-->
<title>Alton Towers Mania - For everything Alton Towers! :: Website Features</title><!--------------------->

</head>

<body>

<div id="bigwrapper">

<!--If local.txt exits then include localhost db connection code otherwise include live db connection code-->
<!--------------------->

<div id="container">


<div id="header">
	<a href="index.php">
		<img src="img/site_graphics/header/header.jpg" alt="Alton Towers Mania" />
	</a>
</div>


<div id="navigation">
	<img src="img/headings/navbar_headings/navigation.jpg" alt="Navigation" class="heading" />

<div id="navlinks">
<ul>
	<li>-&nbsp;<a href="index.php">Home</a></li>
	<li>-&nbsp;<a href="guides.php">Guides</a></li>
	<li>-&nbsp;<a href="featuresinfo.php">Features & Info</a></li>
	<li>-&nbsp;<a href="multimedia.php">Multimedia</a></li>
	<li>-&nbsp;<a href="map.php">Resort Map</a></li>
	<li>-&nbsp;<a href="photokorn">Image Gallery</a></li>
	<li>-&nbsp;<a href="#.php">Community Forum</a></li>
	<li>-&nbsp;<a href="contactus.php">Contact Us</a></li>
</ul>
</div>
<img src="img/small_graphics/menu_divider.gif" class="menudivider" />

<img src="img/headings/navbar_headings/status.jpg" alt="Resort Status" class="heading" />
<div id="status">
	<p>Theme Park:<img src="img/small_graphics/park_status/open.gif" alt="The theme park is currently OPEN." /></p>
	<p>Hotels:<img src="img/small_graphics/park_status/open.gif" alt="The hotels are currently OPEN." /></p>
	<p>Spa:<img src="img/small_graphics/park_status/open.gif" alt="The spa is currently OPEN." /></p>
	<p>Waterpark:<img src="img/small_graphics/park_status/open.gif" alt="The waterpark is currently OPEN." /></p>
	<p>Golf:<img src="img/small_graphics/park_status/open.gif" alt="The golf is currently OPEN." /></p>
	<p>Conf Centre:<img src="img/small_graphics/park_status/open.gif" alt="The conference centre is currently OPEN." /></p>
</div>

<img src="img/small_graphics/menu_divider.gif" class="menudivider" />

<img src="img/headings/navbar_headings/daytip.jpg" alt="Day Tip" class="heading" />
<div id="tip">
	<p>
		When staying at one of the two Alton Towers Hotels, use the Woodland Walk to your advantage. It's a quick and easy way to get to and from the park.	</p>
	<br />
</div>

<img src="img/small_graphics/menu_divider.gif" class="menudivider" />

<img src="img/headings/navbar_headings/randomride.jpg" alt="Random Ride" class="heading" />
<div id="randomride">
	<p>
		<a href="ride_detail.php?ride_id=24">The Teacups</a>	</p>
</div>

<img src="img/small_graphics/menu_divider.gif" class="menudivider" />

<!--Creates a bit of space at bottom of nav-->
<br />
<br />
<br />
<br />


</div>

<div id="content">

	<div id="breadcrumb">
			</div>

	<div id="date">
			</div><!--################################################# - START PAGE CONTENT - ####################################################-->

<p>Check out the list below of a wide range of features for you to look at. From A full gallery to a time line of events at the resort, we have it all!</p>

<br /><br />


	<table class="noborder">
		<tr><td><a href="/photokorn">Image Gallery</a></td></tr>
		<tr><td><a href="/phpbb3">Community Forum</a></td></tr>
		<tr><td><a href="news.php">News</a></td></tr>
		<tr><td><a href="prices.php">Prices</a></td></tr>
		<tr><td><a href="gettingthere.php">Getting to Alton Towers</a></td></tr>
		<!--<tr><td><a href="#" class="strikethrough">Where to Stay</a></td></tr>--><!--stay.php-->
		<tr><td><a href="openingtimes.php">Opening Times</a></td></tr>
		<!--<tr><td><a href="events.php">Shows and Events</a></td></tr>-->
		<tr><td><a href="weather.php">Local Weather at Alton Towers</a></td></tr>
		<tr><td><a href="guestquotes.php">Strange Guest Quotations</a></td></tr>
		<!--<tr><td><a href="midwaygames.php">Midway Games</a></td></tr>-->
		<!--<tr><td><a href="#" class="strikethrough">Where to Eat</a></td></tr>--><!--food.php-->
		<!--<tr><td><a href="#" class="strikethrough">Express Queuing</a></td></tr>-->
		<tr><td><a href="contactat.php">Contacting Alton Towers</a></td></tr>
		<tr><td><a href="merlin.php">About Merlin Entertainments Group</a></td></tr>
		<tr><td><a href="yourday.php">Your Day at Alton Towers</a></td></tr>
		<tr><td><a href="shortcutpasses.php">Shortcut Passes</a></td></tr>
		<tr><td><a href="themetune.php">Alton Towers Theme Tune</a></td></tr>
		<!--<tr><td><a href="membership.php">Membership System</a></td></tr>-->
		<!--<tr><td><a href="#">Ride Tracker</a></td></tr>-->
		<tr><td><a href="duelboard.php">Duel - High Score Board</a></td></tr>
		<tr><td><a href="games.php">Games</a></td></tr>
		<tr><td><a href="newsletter.php">Stay Updated! - Newsletter, SMS Alerts, RSS</a></td></tr>
		<!--<tr><td><a href="/photokorn/index.php?action=showgal&cat=10&section=chainedoak">The Chained Oak</a></td></tr>--><!--photokorn/index.php?act=oak-->
		<!--<tr><td><a href="/photokorn/index.php?action=showgal&cat=37&section=plans">Plans &amp; Ride Visualisations</a></td></tr>--><!--photokorn/index.php?act=plans-->
		<!--<tr><td><a href="/photokorn/index.php?section=showgal&cat=11&action=behindscenes">Behind the Scenes at Alton Towers</a></td></tr>--><!--photokorn/index.php?act=behind-->
		<!--<tr><td><a href="#">On-Ride Photography</a></td></tr>--><!--photokorn/index.php?act=onridepics-->
		<tr><td><a href="attl.php">Alton Towers Time Line</a></td></tr>
		<!--<tr><td><a href="#">History</a></td></tr>-->
		<tr><td><a href="about.php">About Alton Towers Mania</a></td></tr>
		<tr><td><a href="credits.php">Copyright &amp; Credits</a></td></tr>
	</table>
	
<!--################################################# - END PAGE CONTENT - ####################################################-->
<div id="insidefooter" style="text-align: center;">
	<br /><br />
	<hr />
	<p><a href="#top">Top of Page</a> | Version 3.1 alpha</p>

	<!--Code to remove the dotted line around ActiveX controls-->
	<script type="text/javascript" src="swfobject.js"></script>
	
	<br /><br />
	
	<!--If live.txt exits then show infobox with link to admin panel-->
			<div class="infobox">
			<p style="text-align: center;">
				<b>
					DEVELOPMENTAL VERSION - <a href="admin/index.php" target="_blank">Admin Panel</a>
				</b>
			</p>
		</div>
		<!-------------end--------->

<br /><br />
	
</div><!--End Inside Footer-->




</div><!--End Content-->


<!--Pulls content div down around all the floats-->
<div class="clearer"></div>

</div><!--End Container-->
</div><!--End Bigwrapper-->

</body>
</html>

Thanks

Neil

Sorry that was my bad:


#content table .noborder, #content .noborder tr, #content .noborder th, #content .noborder td
{
border: 0px;
}

Should be:


[B]#content .noborder[/B], #content .noborder tr, #content .noborder th, #content .noborder td
{
border: 0px;
}

Thankyou

so can you just write in english sentences what that last css selector is actually saying?

The Content .noborder one? It will set the border to 0px where the element has a class of .noborder inside the element with the id of Content.
Which in your case is your main table.

I meant the whole line from beginning to end.

Content .noborder will target this…


<div id="content">
<p class="noborder>...</p>
or
<table class="noborder">...</table>
or
<div class="noborder">...</div>
etc
</div>

Content .noborder td will target…


<div id="content">
<table class="noborder">
<tr><td>this<td></tr>
</table>
</div>

Content .noborder th will target…


<div id="content">
<table class="noborder">
<tr><th>this<th></tr>
</table>
</div>

etc

so, what do the commas mean? Could the several commas be removed and that line be represented as 3 or was it 4 separate css statements or is there another reason for the comma?

The commas is just to separat the statements. You could also have written it like this:


#content .noborder { border: 0px; }
#content .noborder tr { border: 0px; }
#content .noborder th { border: 0px; }
#content .noborder td { border: 0px; }
etc

But less repeating code is better and cleaner so you should use:


#content .noborder, #content .noborder tr, #content .noborder th, #content .noborder td
{
border: 0px;
}

Excellent, Thanks thats great!