Line breaks

[jakhall]

Hi all.
I'm just a begginer at this css stuff and just spent a couple of hours going through some of the past posts on here after using the 'search' function to try and get an answer to my question rather than posting.
I've learnt a lot just from that excersise!
But alas...no answer to my question, so here goes..

I am trying to find out how to put 'line breaks' in and still be able to have my page validated under the 'strict' method of dtd.
I keep getting the error message...
Line 16, column 0: character data is not allowed here

< /br>

You have used character data somewhere it is not permitted to appear. Mistakes that can cause this error include putting text directly in the body of the document without wrapping it in a container element (such as a <p>aragraph</p>) or forgetting to quote an attribute value (where characters such as "%" and "/" are common, but cannot appear without surrounding quotes).

Line 20, column 4: document type does not allow element "BR" here; missing one of "P", "H1", "H2", "H3", "H4", "H5", "H6", "PRE", "DIV", "ADDRESS" start-tag

<br />

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

The other thing while I am here....
I'm trying to get my 'links' to change as I 'hover' and 'click' on them etc...
I have inserted the following into an external style sheet...

h2
{font-size:18pt;
font-family: Times New Roman;
font-style: italic;
text-align: center;
a:link {color: blue;text-decoration: none;}
a:visited {color: red; text-decoration: none;}
a:acitve {color:red; text-decoration: none;}
a:hover {color:green; text-decoration: underline;}

where am I going wrong people?

[krak_d]

Hi jakhall,

you are missing a curly bracket and also have a spelling mistake!

h2
{font-size:18pt;
font-family: Times New Roman;
font-style: italic;
text-align: center;}
a:link {color: blue;text-decoration: none;}
a:visited {color: red; text-decoration: none;}
a:acitve {color:red; text-decoration: none;}
a:hover {color:green; text-decoration: underline;}

where am I going wrong people?

hope this helps.

[jakhall]

Hey Krak_d
thanks a lot mate!~

It works now!!! brilliant.

so...now....how do I get line breaks in my page?

[coothead]

Hi there jakhall,

Just one small point concerning links, there is a correct order
in which to declare them.....

• a:link
• a:visited
• a:hover
• a:active

...see http://www.w3schools.com/css/css_pseudo_classes.asp and http://www.w3.org/TR/REC-CSS2/selector.html#x27

As for....

<br />

' The mentioned element is not allowed to appear in the context in which you've placed it; '

.....please post your code, so that we may see 'the context' that is causing this comment

coothead

[krak_d]

<br />

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

Check through your code for unclosed tags as mentioned and that they are all positioned correctly!

As far as i know the <br> element doesn't require a corresponding </br> though!

[HTML]

In HTML The line break tag is

<br>

no closing tag.

In XHTML It is

<br />

To put it simply, the space/ closes the tag within the opening tag.

Dave

[jakhall]

Thanks guys, I went through and removed any line breaks I had and the document got validated under the strict dtd!
But as soon as I put in 1 of these <br /> it got knocked back by the strict dtd with the following message...

Line 25, column 93: document type does not allow element "IMG" here; missing one of "P", "H1", "H2", "H3", "H4", "H5", "H6", "DIV", "ADDRESS" start-tag

<img src="images/presenterjeffhall.JPG" alt="Presenting...Jeff blah" width="258" height="272">

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

Here is the offending code that I am tryibg to validate...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>

<title>Resume</title>
<meta http-equiv="Content-Type" content="application/html 4.01//EN; charset=utf-8">
<link rel="stylesheet" href="rstyle.css" type="text/css">
<style type="text/css">

</style>

</head>

<body>
<h2><a href="index.html">Home</a>
&nbsp;&nbsp;
<a href="family.html">Family</a>&nbsp;&nbsp; <a href="poolproject.html">Pool
</a>&nbsp; <a href="netstuff.html">Internet </a>&nbsp; <a href="resume.html">Resume</a></h2>

<br />
<br />
<h1>Resume for Jeff Blah</h1>

<img src="images/presenterjeff.JPG" alt="Presenting...Jeff blah"
width="258" height="272">

<h3>Contact Details.</h3> etc...etc...etc....

Also...I can you tell me how I can get that image (presenterjeff.jpg) aligned to the right of page with 'contact details' etc text alined to the left of the pic so that I don't get the error message for that as well?

[HTML]

If you are trying to validate to HTML you are using the wrong linebreak code still. Read above once more regarding the difference between XHTML and HTML.

aligning your image can be done either through CSS positioning(I am terrible at it) or through HTML tables.

Dave

[jakhall]

Thanks for your reply Dave, I understand what you are saying.
Since I am trying to get this page validated through strict html and not xhtml, I changed all the <br /> codes for the plain <br></br> so that it now looks something like this...

<a href="family.html">Family</a>&nbsp;&nbsp; <a href="poolproject.html">Pool
</a>&nbsp; <a href="netstuff.html">Internet </a>&nbsp; <a href="resume.html">Resume</a></h2>
<br>
</br>
<h1>Resume for Jeffblah</h1>
<br>
</br>

and this is the message I got back...

Line 21, column 3: document type does not allow element "BR" here; missing one of "P", "H1", "H2", "H3", "H4", "H5", "H6", "PRE", "DIV", "ADDRESS" start-tag

<br>

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

✉

Line 22, column 4: end tag for element "BR" which is not open

</br>

The Validator found an end tag for the above element, but that element is not currently open. This is often caused by a leftover end tag from an element that was removed during editing, or by an implicitly closed element (if you have an error related to an element being used where it is not allowed, this is almost certainly the case). In the latter case this error will disappear as soon as you fix the original problem.

If this error occured in a script section of your document, you should probably read this FAQ entry.

PS: the positioning of the image to the right with text on the left is proving to be impossible for me to do for some reason #@$#@$#!!!
I am using an external style sheet with this page, does anyone know how I can achieve my desired alignment using css?
I'm about to chuck a brick..SOMEWHERE!!!

[coothead]

Hi there jakhall,

There are two ways that you can resolve the <br /> problem.

First you can simply enclose them within a div thus...

<div><br /><br /></div>

....or you can style the <h1> tag with...

 margin-top:58px;

....which will give more precise positioning.

The <img> tag needs to be enclosed within a div and like the <br />
needs to be closed with a"/".

I have used float:right; to position the img and the text.

So here is how the validated code would look...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Resume</title>
<meta http-equiv="Content-Type" content="application/html 4.01//EN; charset=utf-8"/>
<link rel="stylesheet" href="style.css" type="text/css"/>

<style type="text/css">
/*<![CDATA[*/
#resume {
     margin-top:58px;
 }
#presenting {
     float:right;
     width:258px;
     height:272px;
 }
#contact {
     float:right;
     padding-right:10px;
 }
#clear {
     clear:both;
 }
/*//]]>*/
</style>
]
</head>
<body>

<h2>
<a href="index.html">Home</a>&nbsp;&nbsp;
<a href="family.html">Family</a>&nbsp;&nbsp; 
<a href="poolproject.html">Pool</a>&nbsp; 
<a href="netstuff.html">Internet </a>&nbsp; 
<a href="resume.html">Resume</a>
</h2>

<h1 id="resume" >Resume for Jeff Blah</h1>

<div>
<img id="presenting" src="images/presenterjeff.JPG" alt="Presenting...Jeff blah"/>
<div id="contact"<h3 >Contact Details.</h3> etc...etc...etc....</div>
</div>
<div id="clear"></div>

</body>
</html>

coothead

[jakhall]

Krack d....Coothead....Dave....

You guys are unreal!
Thanks for that example code with the 'floating' stuff Coothead, I juggled that around and finally got it all to work and validated to strict dtd!!!!! yeah baby!!!!!

I really appreciate your time and thanks for the patience and lessons !
As we say down here in Oz...."You bloody beaudy mate"!