16 replies [Last post]
patrickco
patrickco's picture
Offline
Enthusiast
Los Angeles
Last seen: 11 years 9 weeks ago
Los Angeles
Timezone: GMT-7
Joined: 2005-04-17
Posts: 157
Points: 12

Hi everyone.. I am in the process of validating my code, and I have gotten numerous errors that I am a little confused about and wonder if anyone here can help to give me an example of what the problem is:

first off.. the web url is:

http://collinatorstudios.com/heather/upload/massage.html

The first error I got gave me a good explanation.. However, I don't understand why this is "bad".. I did a <p><h1></p> and it says I cannot do a block level element within an inline---------------- So, why is this, and how is the best way to have a header in a <p> ?

the next error I got I am totally lost about-- it says:

Line 76, column 2: document type does not allow element "p" here; missing one of "object", "ins", "del", "map", "button" start-tag

<p>Shiatsu literally means fingerpressure. The practitioner uses their own natu

...

The next error that I am confused about is:

Line 74, column 4: start tag was here

</p><p><strong>

(and the < of the <p> is highlighted)

.. any thoughts???????

-patrick

HellsBells
HellsBells's picture
Offline
Leader
Bedford, UK
Last seen: 14 years 3 weeks ago
Bedford, UK
Joined: 2004-04-07
Posts: 851
Points: 0

xhtml validating errors

Hi

Just a couple of things to sort out.

I guess you know to put in an alt tag on the image.

<h1> tags are like their own little paragraphs so they don't need paragraph tags around them - they will make a double line break under themselves.

You've got a couple of errors with paragraph tags that are unclosed or unecessary - I find that it's much much easier to have the opening <p> tag on the same line as the paragraph it refers to rather than after the closing tag of the line above - much less likely to get confused.

The next error is this one:

<p><strong>
<em>Shiatsu</em></strong>
<p>Shiatsu literally ....

You've either opened an extra paragraph before the words "Shiatsu literally..." or you've forgotten to close the one before the stronger writing.

It might be better to use a smaller heading tag and style it how you want so it'd look like this:

<h3>Shiatsu</h3>
<p>Shiatsu literally.... </p>

The final error is this:

</p><p>

<strong>
Massage Fees:
</strong></p><p>
$75 / 60 minutes<br />
$100 / 90 minutes<br />
$140 / 120 minutes<br />

You've opened the paragraph tag up there after the last closing tag but you haven't closed it - so you need to make that last <br /> tag a </p> instead.

Then it all validates.

My strategy is so simple an idiot could have devised it!

"Also, your CSS (no offence) makes me want to gouge my eyes out with a rusty spoon" - TPH

patrickco
patrickco's picture
Offline
Enthusiast
Los Angeles
Last seen: 11 years 9 weeks ago
Los Angeles
Timezone: GMT-7
Joined: 2005-04-17
Posts: 157
Points: 12

xhtml validating errors

ahh.. well that was a lot simpler than it looked! Thanks for the explanation and help...

when validating the pranayama.html page:

http://www.collinatorstudios.com/heather/upload/pranayama.html

I get this error, which is confusing because I thought <center> is a standard element that exists no matter what?? Plus I referenced it in my css page to make sure the font was the same as in the #content #principalbody p section... thanks in advance for your help.

Error Line 55 column 10: element "center" undefined.
<p><center>Vayu is a sanskrit term meaning "air" or "breath".</center></p>

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 7 years 19 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

xhtml validating errors

<center> is not a 'standard' element it's redundant and you wouldn't use it to try and centre text in a paragraph anyway.

You can either pad out the paragraph, use auto margins to centre it within it's parent or text-align: center the text.

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

patrickco
patrickco's picture
Offline
Enthusiast
Los Angeles
Last seen: 11 years 9 weeks ago
Los Angeles
Timezone: GMT-7
Joined: 2005-04-17
Posts: 157
Points: 12

xhtml validating errors

ok.. I was able to fix it on one of my pages, but another:

http://www.collinatorstudios.com/heather/upload/budokon.html

that involves a table.. it's not working-- And this is involving classes I guess which is something I am not too familiar with.

So my previous page had a <div id="content"> then a <div id="principalbody">, and then one of the lines within the paragraphs I wanted centered... So in my css document, I created a .centeredtext and I tried within that page to do <p class="centeredtext">.. However that did not work-- I had to change my css document to #content #principalbody .centeredtext for it to work.. and I am confused why it wouldn't just work to have it as .centeredext all by itself?

And no matter what I do, I can't get the table to look right and be centered now.. Initially I did the same thing <p class="centeredtext"> <table etc etc> -- but that would not validate.. so then I tried changing my css document: #contect #principalbody .centeredtext, #content #principalbody table .centeredtext--- and I changed my table in my xhtml to say class="centeredtext" but that didn't work either....................

So I am a little confused why this isnt working and what i am supposed to do. ?

-patrick

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 11 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

xhtml validating errors

Do this;

 
#content #principalbody .centeredtext,  
#content #principalbody table .centeredtext { 
    font-family: Arial, "Times New Roman", Times; 
    font-size: 90%; 
    width: 90%; 
    text-align: center; 
    margin: 20px auto; 
    color: #444; 
    }


I notice you have empty paragraphs, <p></p>. The W3 sz browsers should ignore empty paragraphs and it recommends they ignore any empty block element.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

patrickco
patrickco's picture
Offline
Enthusiast
Los Angeles
Last seen: 11 years 9 weeks ago
Los Angeles
Timezone: GMT-7
Joined: 2005-04-17
Posts: 157
Points: 12

xhtml validating errors

That is how I currently have it... And the table still does not appear centered whether I specify <table class="centeredtext"> or not.

what am I missing here?

.. regarding the empty paragraphs.. They serve only the purpose of graphically displaying a line that separates content on the page. How else am I to accomplish this without using empty paragraphs?

-patrick

Anonymous
Anonymous's picture
Guru

xhtml validating errors

patrickco wrote:
<table class="centeredtext">
For that your css would have to betable.centeredtextinstead of table .centeredtext

The former means "a table element with the class of centeredtext". The latter means "class of centeredtext inside of a table element".

Something like that. Smile

patrickco
patrickco's picture
Offline
Enthusiast
Los Angeles
Last seen: 11 years 9 weeks ago
Los Angeles
Timezone: GMT-7
Joined: 2005-04-17
Posts: 157
Points: 12

xhtml validating errors

Wow .. ok.. CONFUSED!!!!!!!!!!!

can you please explain your last sentence to me, and maybe give me an example?

I tried what you said and it still does not work..

I have in my css:

#content #principalbody .centeredtext,
#content #principalbody table.centeredtext {
         font-family: Arial, "Times New Roman", Times;
         font-size: 90%;
         width: 90%;
         text-align: center;
         margin: 20px 0;
         padding: 0 10px;
         color: #444;
            }

and in my xhtml I have:

<table cellpadding="0" cellspacing="0" class="centeredtext">
			<tr>
				<td>
					<strong><em>Place</em></strong>
				</td>
				<td>
					<strong><em>Day</em></strong>
				</td>
				<td>
					<strong><em>Time</em></strong>
				</td>
			</tr>
			<tr>
				<td rowspan="2">
						Jiva Yoga<br />
						15327 Sunset Blvd.<br />
						Pacific Palisades, CA 90272<br />
				</td>
				<td>
					Tuesday
				</td>
				<td rowspan="2">
						12:00pm - 1:15pm
				</td>
			</tr>
			<tr>
				<td>
					Thursday
				</td>
			</tr>
			<tr>
				<td rowspan="3">
					Equinox Fitness Club<br />
					201 Santa Monica Blvd.<br />
					Santa Monica, CA 90401<br />
				</td>
				<td>
					Tuesday
				</td>
				<td>
					5pm - 6:15pm
				</td>
			</tr>
			<tr>
				<td>
					Thursday
				</td>
				<td>
					6:30pm to 7:45pm
				</td>
			</tr>
			<tr>
				<td>
					Saturday
				</td>
				<td>
					4pm to 5:15pm
				</td>
			</tr>
		</table>

and it still does not show up centered... Is it that text-align does not work with a table? and that I have to do auto margins?

-p

Anonymous
Anonymous's picture
Guru

xhtml validating errors

patrickco wrote:
can you please explain your last sentence to me, and maybe give me an example?
Perhaps my American is unclear (not English, Wink)

table.centeredtext works on a table with the class of centeredtext<table class="centeredtext">

while

table .centeredtext works on something with a class of centeredtext inside of a table element<table><a href="somewhere.html" class="centeredtext">

patrickco wrote:
I tried what you said and it still does not work..
The text inside of your table is centered perfectly. It does work. :shrug:

If you want the table itself to center you can do this:

#content #principalbody {
									position: relative; 
							 		left: 7%;
									top: 0px; 
									width: 50%;
									height: 300px;
									overflow: auto; 
									overflow-x: hidden;
									/* background: #EFD1FF; */
									background: #F2D9FF;
									border: 1px solid #D0B7DD;
									margin: 0; 
									padding: 0; 
									text-align:center;
								}
 #principalbody table{
									display:inline-table;
									}
(you are adding text-align:center; to #principalbody and defining tables inside of #principalbody as inline-table.)

Hope that helps. Smile

patrickco
patrickco's picture
Offline
Enthusiast
Los Angeles
Last seen: 11 years 9 weeks ago
Los Angeles
Timezone: GMT-7
Joined: 2005-04-17
Posts: 157
Points: 12

xhtml validating errors

ah.. see I am also trying to center the actual table (the lines of the table so that they appear perfectly centered within that scrollable window).

So I guess I can only accomplish this by doing a margin: auto?

-patrick

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 11 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

xhtml validating errors

Look again at the style ruleset I posted and compare to yours. Yours is not the same. Mine has removed the padding rule and changed margin to "20px auto". That makes all the difference. My changes were tested.

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Anonymous
Anonymous's picture
Guru

xhtml validating errors

patrickco wrote:
ah.. see I am also trying to center the actual table (the lines of the table so that they appear perfectly centered within that scrollable window).
I modified my post...sorry. Look at the end. Besides, what's wrong with using auto margins to center it? I was just showing how it can be done with text-align: center.

patrickco
patrickco's picture
Offline
Enthusiast
Los Angeles
Last seen: 11 years 9 weeks ago
Los Angeles
Timezone: GMT-7
Joined: 2005-04-17
Posts: 157
Points: 12

xhtml validating errors

Ok thanks! I tried both of those ways and see that they are working--- however, now I am seeing that there is some really weird thing happening with the outer lines of the table on the left side and top right.. This was not like this when I had the table in a <center>... Any ideas why this is happening?

also, question-- In my html for the table I have <table cellpadding="0" cellspacing="0" class="centeredtext"> .. can I have cellpadding: 0 and cellspacing:0 in my css instead? Are those valid in css?

This is how the table looks in my browser:

thank you.

-patrick

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 11 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

xhtml validating errors

That's because you still have this line.padding: 0 10px;

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

patrickco
patrickco's picture
Offline
Enthusiast
Los Angeles
Last seen: 11 years 9 weeks ago
Los Angeles
Timezone: GMT-7
Joined: 2005-04-17
Posts: 157
Points: 12

xhtml validating errors

aha! Sorry.. I totally missed that.

Thank you very much for your time and help..

What about my question above regarding the cellpadding & cellspacing properties in css? I read that border-collapse is how you do cellpadding & cellspacing 0.. but what if I did want padding? how would i accomplish that with css?

-patrick

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 11 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

xhtml validating errors

td {padding: .5em 10px;}

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.