table based layout is not working in IE

views:

answers:

table based layout is not working in IE

I am trying to design a simple layout for eBay. I have never done it before and have to use html tables as the basis for the layout. It works fine in Firefox, chrome and safari but apparently does not work properly in IE (8 - latest build).

You can see the layout here - http://www.rockymountainsports.ca/ebay/ebay.html

Any direction would be greatly appreciated.

Do not, under any circumstances, use tables for layout (unless you're sending HTML email, but that's another topic). Tables are for tabular data only (like a spreadsheet). The proper way to create a layout is to start with semantically correct HTML code, and then use external CSS stylesheets to create the layout.

I would recommend net.tutsplus.com if you need tutorials.

Josiah Sprague 2010-09-09 23:46:36

I appreciate the answer, the problem is that the layout is for eBay. They do not allow an external style sheet to be linked so, like an html email, I must use tables for the layout. Please let me know if you have any ideas.

Kev 2010-09-09 23:51:02

@Kev, I typically tend towards @Josiah's point of view as regards table-based layouts, but I was wondering: if you have control over the html are you able to use an inline stylesheet (in the document `head`) at all?

David Thomas 2010-09-09 23:59:43

Don't worry, we are all on the same page regarding tables. I would only ever use css to style a website. Ebay only allows you to control the html within the "item". So you can use html tags in the listing area but not anywhere else. I am not sure if you can use css tags in the html, I suppose if you knew what elements they had defined you could use them but you can't set your own in the head of the document.

Kev 2010-09-10 00:53:14

Try using embedded styles in a <style> tag like this;<style>div {display: block;}</style> Just pop that in at the top of the HTML you are allowed to edit. Should work like a charm.

Josiah Sprague 2010-09-10 20:20:08

This worked great, thanks. I just figured they didn't allow css at all.

Kev 2010-09-11 19:40:06

Add a width="100%" to the middle td tag - this should take up th extra space you are seeing.

Josiah's response is valid (if a little dogmatic, IMO). You can probably do as he suggests with divs and backgound images.

Ray 2010-09-09 23:55:19

Josiah's answer is a little dogmatic, as Ray said, but your code is pretty messy. First off it appears that you have a for each row of content. You might solve your problem by cleaning up the tables so you have a single with a for each row of content.

Somewhere buried in there is a problematic that's weird in IE. You may solve it by using a fixed width for your table rather than the percentage you're using now.

Voodoo 2010-09-10 00:03:01

ansaurus

tags:

views:

answers:

table based layout is not working in IE

related questions