SitePoint Sponsor |
|
User Tag List
Results 1 to 10 of 10
-
May 21, 2002, 08:29 #1
DIVs in HTML: 4.01 Transitional?
I'm trying to validate a page as HTML 4.01 transitional, but I'm having problems with some DIVs inside a nested table that I've used to align a single word to the right.
<table cellspacing="0" cellpadding="0" class="wide">
<tr>
<td valign="top" width="132"><img src="blah.gif" width="64" height="64" alt=">>"></td>
<td valign="top" width="11" class="vertical"> </td>
<td valign="top" width="327">
<p><font class="headline">blah blah</font></p>
<p><font>blah blah</font>
<br>
<br>
<font>blah blah blah
<br>
<div class="right"><a href="http://www.blahblah.com/">More</a></div></font></p>
</td>
</tr>
</table>
The class 'right' is simply text-align: right;
The W3C validator is choking on the divs- giving me...
Error: element "DIV" not allowed here; possible cause is an inline element containing a block-level element
Spans validate ok, but lose the right alignment.
I need a way round this that still aligns the word More to the right.
I need to find it fast.
Big, huge, enormous thanks in advanceLast edited by Bill Posters; May 22, 2002 at 11:33.
New Plastic Arts: Visual Communication | DesignateOnline
Mate went to NY and all he got me was this lousy signature
-
May 21, 2002, 08:36 #2
- Join Date
- Oct 2000
- Location
- Nashvegas Baby!
- Posts
- 7,845
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Put the FONT tag inside the DIV tag. FONT is the inline element that the validator is referring to.
Adobe Certified Coldfusion MX 7 Developer
Adobe Certified Advanced Coldfusion MX Developer
My Blog (new) | My Family | My Freelance | My Recipes
-
May 21, 2002, 08:40 #3
- Join Date
- Oct 2000
- Location
- Nashvegas Baby!
- Posts
- 7,845
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Have you also tried using span instead of div?
<span align="right">
or
<span style="text-align;">Adobe Certified Coldfusion MX 7 Developer
Adobe Certified Advanced Coldfusion MX Developer
My Blog (new) | My Family | My Freelance | My Recipes
-
May 21, 2002, 09:31 #4
spans don't work. It won't use the positioning attributes.
I created an extra closing </font> tag so that I could next the <font>...</font> tags within the <div>
Now the validator is questioning the closing </p> tga, saying...
Error: end tag for element "P" which is not open; try removing the end tag or check for improper nesting of elements
The new structure is which is giving me the <p> tag errors is...
<table cellspacing="0" cellpadding="0" class="wide">
<tr>
<td valign="top" width="132"><a href="..." class="mainnav"><img src="blah.gif" width="64" height="64" alt=">>"></a></td>
<td valign="top" width="11" class="vertical"> </td>
<td valign="top" width="327">
<p><font class="headline">...</font></p>
<p><font>...</font>
<br>
<br>
<font>... <a href="..." class="headline">...</a> ...</font>
<div class="right"><font><a href="...">More</a></font></div></p>
</td>
</tr>
</table>New Plastic Arts: Visual Communication | DesignateOnline
Mate went to NY and all he got me was this lousy signature
-
May 21, 2002, 10:00 #5
- Join Date
- Oct 2000
- Location
- Nashvegas Baby!
- Posts
- 7,845
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Hmmmm...
Is the DIV being used once? If it is, then why not set the font style for the text inside the DIV in the DIV selector in your stylesheet? Then you won't have to use a FONT tag in that position.
You could try this:
<td valign="top" width="327">
<div>
<font class="headline">...</font>
<br><br>
<font>...</font>
<br><br>
<font>... <a href="..." class="headline">...</a> ...</font>
<div class="right"><a href="...">More</a></div>
</div>
</td>Adobe Certified Coldfusion MX 7 Developer
Adobe Certified Advanced Coldfusion MX Developer
My Blog (new) | My Family | My Freelance | My Recipes
-
May 21, 2002, 16:27 #6
- Join Date
- Feb 2002
- Location
- Ayr, scotland
- Posts
- 135
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Error: end tag for element "P" which is not open; try removing the end tag or check for improper nesting of elements
the The w3c says so
The P element represents a paragraph. It cannot contain block-level elements (including P itself).
cheers
alastair
-
May 21, 2002, 23:27 #7
The final incarnation that went off yesterday was...
<table cellspacing="0" cellpadding="0" class="wide">
<tr>
<td valign="top" width="132"><a href="http://..." class="mainnav"><img src="blah.gif" width="64" height="64" alt=">>"></a></td>
<td valign="top" width="11" class="vertical"> </td>
<td valign="top" width="327">
<p><font class="headline">...</font></p>
<p><font>...</font>
<br>
<br>
<font>... <a href="http://..." class="headline">...</a> ...</font>
<div class="right"><font><a href="http://...">More</a></font></div><br>
</td>
</tr>
</table>
I wasn't totally comfortable with this as it lacks a </p> tag, but still validates.
I could have also done this...
...
<font>... <a href="http://..." class="headline">...</a> ...</font></p>
<div class="right"><font><a href="http://...">More</a></font></div>
</td>
</tr>
</table>
...but I would have needed to place a <br> after the closing </div> to linebreak space beneath the word 'More'. ...
...
<font>... <a href="http://..." class="headline">...</a> ...</font></p>
<div class="right"><font><a href="http://...">More</a></font></div><br>
</td>
</tr>
</table>
Both ways validated ok, but the one with the trailing <br> seemed untidy to me, so I went with the first option (no closing </p> tag).
I'm still not happy, but it validated.
Perhaps I've just been playing with xhtml too much and expect everything to be closed
thx again for the help guysLast edited by Bill Posters; May 21, 2002 at 23:30.
New Plastic Arts: Visual Communication | DesignateOnline
Mate went to NY and all he got me was this lousy signature
-
May 22, 2002, 10:43 #8
- Join Date
- Aug 1999
- Location
- Lancaster, Ca. USA
- Posts
- 12,305
- Mentioned
- 1 Post(s)
- Tagged
- 0 Thread(s)
You can't put DIV's inside a Paragraph tag... You would have to switch them around.
You could always make a paragraph class with no extra line return by using negative borders. But then you could use paragraphs within your DIV and get rid of most of the linebreaks (<BR>) and still get the same formatting...
If you want to move more into 4.01 strict and XHTML transitional you should change your font tags into spans though.
-
May 22, 2002, 15:28 #9
- Join Date
- Oct 2000
- Location
- Nashvegas Baby!
- Posts
- 7,845
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Wayne...
You don't even need negative borders. Simply specifying
p.something {margin: 0px; }
will remove the extra line break on a p tag with a class of "something". The P will still incldue a line break equal to one <br> tag.Adobe Certified Coldfusion MX 7 Developer
Adobe Certified Advanced Coldfusion MX Developer
My Blog (new) | My Family | My Freelance | My Recipes
-
May 22, 2002, 15:41 #10
Bookmarks