Alternative of <div>.

rupen · November 17th, 2010, 08:33 AM

Hi,

somehow

Code:

<div>
      </table>
      <table> <tr><td><td></table>
</div>

is giving error that u can't embeded bla blah..

so is there any other way to do this?

Note: Why I am doing this is bit leanghty subject.

Thank you

.

Imar · November 17th, 2010, 09:05 AM

Nope, not if you want to create valid HTML.

A <div> can't be placed within <table> and </table> tags directly...

Imar

rupen · November 17th, 2010, 09:25 AM

ok, but what is the alternative for this? is it <span>?

Imar · November 17th, 2010, 10:45 AM

Nope; you simply can't do it. Valid items for within the <table> element are elements like colgroup, thead, tbody and so on, as specified here: http://www.w3.org/TR/1999/REC-html40...tml#edef-TABLE (and <tr> elements, although they should be placed in a tbody)

In other words, you need to rethink your strategy if you want to make this valid HTML.

Why do you need this? Can't you just swap the first <div> and the first </table>?

Imar

Imar · November 17th, 2010, 10:46 AM

Also, your code has two opening <td> elements and no closing </tr> which makes it invalid as well.

Imar

chroniclemaster1 · November 17th, 2010, 12:10 PM

Quote:

Originally Posted by rupen

Code:

<div>
      </table>
      <table> <tr><td><td></table>
</div>

is giving error that u can't embeded bla blah..

so is there any other way to do this?

Note: Why I am doing this is bit leanghty subject.

I concur with Imar. Sometimes when you're facing a challenge, the first issue is figuring out which way you're going to attack the problem. If you're comfortable using <div>s, which some guys aren't, you probably don't need a table here unless it is explicitly being used for tabular data. The fact that you're trying to shove a div element into it, makes me suspect that this is not the case. This is undesirable enough that it's worth taking a second look at the decision making process and see if there's a different approach that would be better.

I would consider this, at least temporarily, a dead end, and give us the lengthy background on why you're trying to do this. Perhaps we will wind up right back here, trying to figure out the "least bad" solution, but more likely we can find a different approach that will be more successful.

rupen · November 18th, 2010, 03:15 AM

I need to do this because: there are few information we need to display in header and footer of print page ( & not in web-page) so when user access the web-page the div tab will not be displayed, (using @media CSS technique) and when user prints the page the footer text (div tag) will be printed.

So, if user prints web-page, I need to end the product list table and insert my footer table with custom CSS page-break else if user is just seeing in web-browser I need to hide the footer text.

Further, the existing page itself is very complex and is written by somebody else some years ago, so can't modify the entire structure of page and have to go with <table> tags as time cruch.

Imar · November 18th, 2010, 03:50 AM

table tags are fine in this case; it's just the incorrect nesting that will cause you problems. Based on your description, I don't see a solid case for this nesting issue; maybe by simply swapping just a few tags around you can fix it and make it valid? It's a bit difficult to suggest something based on this short snippet alone.

The fact that it's bad HTML isn't so bad and is not something that *must* be fixed just so it's valid. Browsers are typically very forgiving. The only problem is of course that it'll lead to other problems: tables disappearing when you're printing, or other weird layout issues may occur.

But if this is just a header and footer issue, why not insert them after the opening and before the closing body tags?

Code:

 
<body>
<div class="PrintOnly">Header only visible when printed</div>
   ...
  Your content here
<div class="PrintOnly">Footer only visible when printed</div>
</body>

The CSS class PrintOnly can then made invisible in the browser, but visible in print.

Hope this helps,

Imar