CSS h1 not working

(2 Pages)
1
2
→

26 Replies - 4193 Views - Last Post: 11 January 2011 - 06:38 PM

#1 eZACKe

Garbage Collector

Reputation: 120

Posts: 1,276
Joined: 01-June 09

CSS h1 not working

Posted 10 January 2011 - 04:17 PM

I'm working on a header for a page that I will use within other files, and one of the CSS elements isn't working. The thing is, all of the other CSS elements are working correctly and as far as I can tell I didn't do this one any different.

header.php

<html><!-- contains the CSS definitions that the page uses, and everything else in the header of every page -->
<head>
	<title>TLA Consulting Pty Ltd</title>
	<style type="text/css"><!-- CSS definitions follow, whenever the things you named here are used elsewhere they have this style -->
	h1 {color:white; font-size:24pt; text-align:center;
			font-family:arial,sans-serif}
	.menu {color:white; font-size:12pt; text-align:center;
			font-family:arial,sans-serif; font-weight:bold}
	td {background:black}
	p {color:black; font-size:12pt; text-align:justify;
			font-family:arial,sans-serif}
	p.foot {color:white; font-size:9pt; text-align:center;
			font-faimly:arial,sans-serif; font-weight:bold}
	a:link,a:visited,a:active {color:white}
	</style>
</head>

<body>

<!-- Page header -->
<table width="100%" cellpadding="12" cellspacing="0" border="0">
<tr bgcolor="black">
	<td align="left"><img src="logo.gif" alt="TLA logo" height="70" width="70"></td>
	<td>
		<h1>TLA Consulting</h1>
	</td>
	<td align="right"><img src="logo.gif" alt="TLA logo" height="70" width="70"></td>
</tr>
</table>

<!-- Menu -->
<table width="100%" bgcolor="white" cellpadding="4" cellspacing="4">
<tr>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Home</span></td>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Contact</span></td>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Services</span></td>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Site Map</span></td>
</tr>
</table><!-- Don't close body and html yet because they will be closed in footer and everything in home is in php tags and we want same CSS -->

This line:

<td>
		<h1>TLA Consulting</h1>
	</td>

Is printing with black text and thus is invisible because the cell it is has black text because of the CSS definition.

Looked the definition over multiple times, but I can't find anything wrong with it. Am I blind or is something else messing this up?

Thanks!

This post has been edited by eZACKe: 10 January 2011 - 04:40 PM

Is This A Good Question/Topic? 0

Replies To: CSS h1 not working

#2 Ntwiles

D.I.C Regular

Reputation: 61

Posts: 493
Joined: 26-May 10

Re: CSS h1 not working

Posted 10 January 2011 - 04:27 PM

Have you tried:

td h1 {
    color:white;
    font-size:24pt;
    text-align:center;06
    font-family:arial,sans-serif
}

This post has been edited by Ntwiles: 10 January 2011 - 04:27 PM

Was This Post Helpful? 0

#3 eZACKe

Garbage Collector

Reputation: 120

Posts: 1,276
Joined: 01-June 09

Re: CSS h1 not working

Posted 10 January 2011 - 04:41 PM

I hadn't tried that, but just gave it a shot. Still no success though. <_<

Was This Post Helpful? 0

#4 EnvXOwner

PHP Brogrammer

Reputation: 355

Posts: 2,314
Joined: 10-August 09

Re: CSS h1 not working

Posted 10 January 2011 - 04:52 PM

how about you ditch tables for layout and use divs instead.

Was This Post Helpful? 3

#5 eZACKe

Garbage Collector

Reputation: 120

Posts: 1,276
Joined: 01-June 09

Re: CSS h1 not working

Posted 10 January 2011 - 04:53 PM

I am only just beginning beginning with HTML/CSS and not trying to make anything that will actually be used. Right now I'm learning how to work with tables.

Was This Post Helpful? 0

#6 EnvXOwner

PHP Brogrammer

Reputation: 355

Posts: 2,314
Joined: 10-August 09

Re: CSS h1 not working

Posted 10 January 2011 - 04:56 PM

You should not learn this way. Tables hold tabular data. Not for layout. It's not a good practice. You should also space your CSS out more to make it easier to read.

Was This Post Helpful? 4

#7 eZACKe

Garbage Collector

Reputation: 120

Posts: 1,276
Joined: 01-June 09

Re: CSS h1 not working

Posted 10 January 2011 - 04:59 PM

I understand what you're saying, but honestly my main focus right now is the PHP that is not in this header file. I'm just picking up some CSS as I go through PHP books. I'm just curious why this line wasn't working is all.

But thanks for the tips anyways!

This post has been edited by eZACKe: 10 January 2011 - 05:04 PM

Was This Post Helpful? 0

#8 EnvXOwner

PHP Brogrammer

Reputation: 355

Posts: 2,314
Joined: 10-August 09

Re: CSS h1 not working

Posted 10 January 2011 - 05:04 PM

eZACKe, on 10 January 2011 - 05:59 PM, said:

my main focus right now is the PHP that is not in this header file.

I don't understand that? Your focus is the PHP that is not in the header file? I see a lot of errors in your CSS I'll fix them, test them and post it on here. I'm going to use an external style sheet for this.

You missed a bunch of ;

Was This Post Helpful? 0

#9 EnvXOwner

PHP Brogrammer

Reputation: 355

Posts: 2,314
Joined: 10-August 09

Re: CSS h1 not working

Posted 10 January 2011 - 05:11 PM

Here is how you fix it.

Change your HTML page to:

<html><!-- contains the CSS definitions that the page uses, and everything else in the header of every page -->
<head>
	<title>TLA Consulting Pty Ltd</title>
	<link rel="stylesheet" type="text/css" href="header.css" />
</head>

<body>

<!-- Page header -->
<table width="100%" cellpadding="12" cellspacing="0" border="0">
<tr bgcolor="black">
	<td align="left"><img src="logo.gif" alt="TLA logo" height="70" width="70"></td>
	<td>
		<h1>TLA Consulting</h1>
	</td>
	<td align="right"><img src="logo.gif" alt="TLA logo" height="70" width="70"></td>
</tr>
</table>

<!-- Menu -->
<table width="100%" bgcolor="white" cellpadding="4" cellspacing="4">
<tr>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Home</span></td>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Contact</span></td>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Services</span></td>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Site Map</span></td>
</tr>
</table><!-- Don't close body and html yet because they will be closed in footer and everything in home is in php tags and we want same CSS -->

Here is your CSS where you screwed up:

h1{
	color:white; 
	font-size:24pt; 
	text-align:center;
	font-family:arial,sans-serif;
}
.menu{
	color:white; 
	font-size:12pt; 
	text-align:center;
	font-family:arial,sans-serif; font-weight:bold;
}
td {
	background:black;
}
p{
	color:black; 
	font-size:12pt; 
	text-align:justify;
	font-family:arial,sans-serif;
}
p.foot{
	color:white; 
	font-size:9pt; 
	text-align:center;
	font-family:arial,sans-serif; font-weight:bold;
}
a:link,a:visited,a:active{
	color:white;
}

Please note my CSS. I spaced it out appropriately. You forgot a bunch of semicolons. That's why you should space it out more. You also spelled family wrong. Please stop using tables. You're only making it harder for us and yourself.

This post has been edited by EnvXOwner: 10 January 2011 - 05:12 PM

Was This Post Helpful? 0

#10 eZACKe

Garbage Collector

Reputation: 120

Posts: 1,276
Joined: 01-June 09

Re: CSS h1 not working

Posted 10 January 2011 - 05:19 PM

EnvXOwner, on 10 January 2011 - 08:04 PM, said:

eZACKe, on 10 January 2011 - 05:59 PM, said:

my main focus right now is the PHP that is not in this header file.

What I meant by that is my main concern is learning PHP right now, so learning "good practice" in CSS is reserved for a later date.

Thanks for providing me with the tips though.

EDIT: Although I do have to add that it's still not working.

This post has been edited by eZACKe: 10 January 2011 - 05:23 PM

Was This Post Helpful? 0

#11 EnvXOwner

PHP Brogrammer

Reputation: 355

Posts: 2,314
Joined: 10-August 09

Re: CSS h1 not working

Posted 10 January 2011 - 05:26 PM

eZACKe, on 10 January 2011 - 06:19 PM, said:

EnvXOwner, on 10 January 2011 - 08:04 PM, said:

eZACKe, on 10 January 2011 - 05:59 PM, said:

my main focus right now is the PHP that is not in this header file.

That's weird, it was working for me. Is any CSS working with my code. If not then it's because you didn't create the right file name or put it in the right directory.

Was This Post Helpful? 0

#12 eZACKe

Garbage Collector

Reputation: 120

Posts: 1,276
Joined: 01-June 09

Re: CSS h1 not working

Posted 10 January 2011 - 05:27 PM

Again all of the CSS is working except for the h1

This post has been edited by eZACKe: 10 January 2011 - 05:27 PM

Was This Post Helpful? 0

#13 EnvXOwner

PHP Brogrammer

Reputation: 355

Posts: 2,314
Joined: 10-August 09

Re: CSS h1 not working

Posted 10 January 2011 - 05:29 PM

Is this what you're aiming for:
Attached Image

Was This Post Helpful? 0

#14 eZACKe

Garbage Collector

Reputation: 120

Posts: 1,276
Joined: 01-June 09

Re: CSS h1 not working

Posted 10 January 2011 - 05:33 PM

Yep, that's it!

Now why is it working for you and not me?

Just going to throw my code down here one more time with the additions from you:

<html><!-- contains the CSS definitions that the page uses, and everything else in the header of every page -->
<head>
	<title>TLA Consulting Pty Ltd</title>
	<style type="text/css"><!-- CSS definitions follow, whenever the things you named here are used elsewhere they have this style -->
	h1{
	color:white; 
	font-size:24pt; 
	text-align:center;
	font-family:arial,sans-serif;
}
.menu{
	color:white; 
	font-size:12pt; 
	text-align:center;
	font-family:arial,sans-serif; font-weight:bold;
}
td {
	background:black;
}
p{
	color:black; 
	font-size:12pt; 
	text-align:justify;
	font-family:arial,sans-serif;
}
p.foot{
	color:white; 
	font-size:9pt; 
	text-align:center;
	font-family:arial,sans-serif; font-weight:bold;
}
a:link,a:visited,a:active{
	color:white;
}

	</style>
</head>

<body>

<!-- Page header -->
<table width="100%" cellpadding="12" cellspacing="0" border="0">
<tr bgcolor="black">
	<td align="left"><img src="logo.gif" alt="TLA logo" height="70" width="70"></td>
	<td>
		<h1>TLA Consulting</h1>
	</td>
	<td align="right"><img src="logo.gif" alt="TLA logo" height="70" width="70"></td>
</tr>
</table>

<!-- Menu -->
<table width="100%" bgcolor="white" cellpadding="4" cellspacing="4">
<tr>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Home</span></td>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Contact</span></td>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Services</span></td>
	<td width="25%">
		<img src="s-logo.gif" alt="" height="20" width="20" />
		<span class="menu">Site Map</span></td>
</tr>
</table><!-- Don't close body and html yet because they will be closed in footer and everything in home is in php tags and we want same CSS -->

Was This Post Helpful? 0

#15 EnvXOwner

PHP Brogrammer

Reputation: 355

Posts: 2,314
Joined: 10-August 09

Re: CSS h1 not working

Posted 10 January 2011 - 05:35 PM

Use an external stylesheet like I did and see if that fixes the issue.

Was This Post Helpful? 0

(2 Pages)
1
2
→

26 Replies - 4193 Views - Last Post: 11 January 2011 - 06:38 PM

CSS h1 not working

Replies To: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Re: CSS h1 not working

Follow & Share

Give It A Try!

Programming

Web Development

Reference Sheets

Bye Bye Ads

Monthly Drawing