Forums

DonL

OK, I'm starting to get the hang of this CSS stuff. I've got a website and have started using an external CSS sheet to format body, h1, h2, links, p, etc. The only one I haven't figured out yet is setting table characteristics. If I use the "table" tag, none of external CSS features show up. If I do the same CSS inline right after <table, it works fine. These are simple tables with one column and two or three rows. Do I need to be doing something with tr, td or something else. I'm stumped. Thanks for your help...Don in St. Paul

TT_Mark

Can you post an example of your code?

DonL

Hi,

Here's a big chunk of my external CSS, including the table section. Below that is the inline style I use that works. Thanks for looking at it.

/* SETS BACKGROUND COLOR FOR THE WHOLE PAGE */
body {background-color:yellow;
	margin-left: 200px; 
	margin-right: 200px
	width: 900px;
	}	 

/* SETS COLOR, FONT AND ALIGNMENT FOR THE MAIN TITLE */	 
h1   {
	font-family:"Trebuchet MS",Arial,"sans-serif";
	font-size:36px;
	color:Navy;
	font-style:italic;
	font-weight:bold;
	text-align:center;
	}
	
/* SETS COLOR, FONT AND ALIGNMENT FOR SECTION HEADINGS */
h2	{
	font-family:"Trebuchet MS",Arial,"sans-serif";
	font-size:17px;
	color:Navy;
	font-style:italic;
	font-weight:bold;
	text-align:center;
	}	 

/* FORMATS TEXT IN THE MAIN PARAGRAPHS */
p	{
	 font-family:"Trebuchet MS", Arial, "sans-serif";
	 color:#000000;
	 font-size:13px;
	 font-weight:bold;
	 text-align:left;
	 vertical-align:text-top;
	}


/* FORMATS TEXT IN THE PICTURE CAPTIONS */
h3 {
	 font-family:Arial,"sans-serif";
	 color:#800000;
	 font-weight:bold;
	 font-style:italic;
	 text-align:left;
	 font-size:10px;
	}

/* FORMATS BOOKMARK HYPERLINKS */
.links2 {list-style-type: none;
		padding-left: 0;
		margin-left: 0;
		display: block;
		color: #800000
		font-family: Arial;
		font-weight: bold;
		text-align: left;
		font-size: 13px;
		font-style: italic;
		}				
/* FORMATS HORIZONTAL LINE UNDER THE TITLE */
hr	 {
		border:0;
		color:#800000;
		height:2px;
		width:70%;
	}
	
/*FORMATS TABLE PROPERTIES */
table 	{
		border-collapse:collapse;
		border:5px solid red;
		width:34%;
	 	align:right;
		float:right;
		font-family:Arial,"sans-serif";
		color:green;
		font-weight:bold;
		font-style:italic;
		text-align:left;
		font-size:11px;		
		}

<table style="border-collapse: collapse; border:5px solid red; align:right; float:right" width="34%" id="AutoNumber2">

Edit: Code tags added by Mod

Paulie_D

Please use the 'code' button when inserting code next time...Ta.

DonL

OK. Found it. This is my first time posting here. Do you need me to resend anything?

thomas

Which external styles aren't working correctly? The only reason an inline style should work when an external one doesn't is if the external rule is being overwritten by another rule.

If possible, you should avoid inline styles.

DonL

The section that isn't rendering correctly is the table section. Do I also need to declare for cells/rows or other table elements even if I don't want them highlighted?

treehouse : what would you like to learn today?

Forums

Set HTML table attributes with external CSS