homepage Welcome to WebmasterWorld Guest from 54.204.141.129
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Browsers / Opera Browser Usage and Support
Forum Library, Charter, Moderator: open

Opera Browser Usage and Support Forum

    
Problem with table (Opera7 and IE 5.5)
Table spacing padding in opera 7 IE 5.5
LeeB




msg:1585896
 8:26 pm on Mar 22, 2005 (gmt 0)

Hello,

Iím new to web development and am encountering a problem with a table of images that only materialises with Opera 7 (version 7.54) and IE 5.5. In a nutshell, the second cell image is not butted right up against the edge of first cell even though the alignment is left and the spacing/padding is set to zero.

The html code:

<TABLE width="100%" class="MainHeader">
<TR>
<TD bgcolor="white" class="HeaderCell"><A href="http://example.com/detling.html" target="_blank"><IMG src="images/detling_emblem.gif" align="left" title="View info on the Detling Millenium Sign" alt="Detling Millenium Sign"></A></TD>
<TD bgcolor="#53B853" class="HeaderCell"><IMG src="images/Detling_Title.gif" align="left" alt="Detling Parish"></TD>
<TD bgcolor="#53B853" class="HeaderCell"><IMG src="images/Detling_Pics.gif" align="right" alt="Images of Detling"></TD>
</TR>
</TABLE>

CSS Code:

.HeaderCell,
.MainHeader
{
PADDING-TOP: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
PADDING-RIGHT: 0px;
MARGIN: auto;
BORDER-RIGHT: 0px;
BORDER-TOP: 0px;
BORDER-LEFT: 0px;
BORDER-BOTTOM: 0px;
BORDER-COLLAPSE: collapse;
border-spacing: 0;
}

.MainHeader
{
height: 70px;
}

Many Thanks
LeeB

<Sorry, no personal URLs.
See Terms of Service [webmasterworld.com]>

[edited by: tedster at 1:09 am (utc) on Mar. 23, 2005]

 

tedster




msg:1585897
 5:34 am on Mar 23, 2005 (gmt 0)

Hello LeeB, and welcome to the forums.

There are different causes for what looks like the same behavior in IE 5.5 and Opera 7.54.

First, note that the align attribute is deprecated - and if you are using a full DTD, then Opera will (rightly) ignore any deprecated attributes.

What you are looking for is a rule that aligns the content within the table cell - the <td> element. But your mark-up gives an align attribute to the <img> element instead, rather than to the <td>. Try working with text-align:left for the <td> elements.

Even before it was deprecated, I saw a lot of markup where the author was confused about the align atttribute. When the align attribute is applied to an <img> tag, it FLOATS the image left or right and then wraps the other content around the image. It's not just "push it all the way to the left."

Also note that you have three different elements interacting in this layout: an anchor tag, image tags, and table cells. You'll need to have CSS rules for all those elements to avoid having some browser or other apply default margins and/or padding.

LeeB




msg:1585898
 12:18 pm on Mar 23, 2005 (gmt 0)

Code corrected as per your comments, many thanks.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Browsers / Opera Browser Usage and Support
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved