Hello all,
am very frustrated because I can't get a simple table to display the same way in both browsers. It displays the way I want it to in Firefox but not in IE7 (Windows XP).
1) not sure if my doctype is correct- this is just a plain vanilla html page, so I used
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
2) I have tried to put cell padding=0, margin=0 on the table and the table cells in both the style sheet and the html document. No combination has worked so that IE7 will display the table row without the slight padding at the bottom of the row.
I have added a border so that you can clearly see that the bottom of the rounded red corners do not touch the bottom of the row.
I've even set the width and height of the table cells to those of the graphic but no luck. (I've checked the graphic, there is no white border around it).
3) I can't get the center td's contents (a 1px by 1px graphic that I've stretched to 300 px) to align to the top in IE7.
Any help is appreciated, thank you!
Here's the page ...
Here is my html page's code: -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-
-
<html lang="en">
-
<head>
-
<title>Foreclosure Prevention USA home page
-
</title>
-
-
<style>
-
h1 {color: #ff0000; font-size: 26px; font-family: arial;}
-
-
-
table {
-
border-collapse: collapse;
-
padding: 0px;
-
margin: 0px;
-
}
-
-
tr {
-
padding: 0px;
-
margin: 0px;
-
}
-
-
td {
-
padding: 0px;
-
margin: 0px;
-
}
-
-
td.cellTopAlign {vertical-align: top;}
-
td.cellBottomAlign {vertical-align: bottom;}
-
-
</style>
-
-
</head>
-
-
-
<body>
-
<h1>Foreclosure Prevention USA home page
-
</h1>
-
-
<table border="1" cellpadding="0" cellspacing="0">
-
<tr height="65px">
-
<td class="cellTopAlign"><img src="top_left_rounded_corner.jpg" width="65px" height="65px"/>
-
</td>
-
<td class="cellTopAlign"><img src="pixel.jpg" width="300px" height="1px"/>
-
</td>
-
<td class="cellTopAlign"><img src="top_right_rounded_corner.jpg"width="65px" height="65px"/>
-
</td>
-
</tr>
-
-
-
</table>
-
</body>
-
</html>
-
12  16086 
Your doctype is fine. All new pages should always use the strict doctype.
But you should never use tables for layout.
Validate for your list of 31 html errors. The 'alt' errors can be ignored for now.
Another problem you'll have is with that geocities page. The garbage they put at the top will throw IE into quirks mode. That's not the problem with your table right now, though.
Hello drhowarddrfine!
You are absolutely right- I scrolled through the 31 errors and almost all of them are from garbage code that geocities inserted.
The only reason I ftp'd the page out to geocities is because I do not yet have a web hosting service. I just needed a way for you guys to be able to look at this page.
If you copy and paste my code into an html document and view it locally on your computer, I'd be curious how it looks for you. I found that when looking at it on Geocities in Firefox, the table displays the way I intend (graphics are all lined up, and no white space at the bottom of the rounded red corners). If I open the html page locally on my computer, it doesn't even display properly in Firefox, let alone IE7.
You recommend that I don't use tables for layout, but I'm just not sure what's the most efficient way to set up a containing "box" like this which will hold text. Should I make the entire box as a graphic and use layers to position text inside of it?
Thanks!
Your doctype is fine. All new pages should always use the strict doctype.
But you should never use tables for layout.
Validate for your list of 31 html errors. The 'alt' errors can be ignored for now.
Another problem you'll have is with that geocities page. The garbage they put at the top will throw IE into quirks mode. That's not the problem with your table right now, though.
You recommend that I don't use tables for layout, but I'm just not sure what's the most efficient way to set up a containing "box" like this which will hold text.
Heading to the ball game. Threw this together. I'll be back. -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-
-
<html lang="en">
-
<head>
-
<title>Foreclosure Prevention USA home page
-
</title>
-
-
<style type="text/css">
-
*{margin:0;padding:0}
-
h1 {color: #ff0000; font-size: 26px; font-family: arial;}
-
-
#left{
-
width:65px;
-
height:65px;
-
-
}
-
#middle{
-
width:65px; height:1px; vertical-align:top;
-
}
-
#right{
-
width:65px; height:65px
-
}
-
</style>
-
-
</head>
-
-
-
<body>
-
<h1>Foreclosure Prevention USA home page
-
</h1>
-
-
<img id="left" src="top_left_rounded_corner.jpg">
-
<img id="middle" src="pixel.jpg" >
-
<img id="right" src="top_right_rounded_corner.jpg" >
-
-
</body>
-
</html>
-
Hello Koelner,
I think the solution for your problem you can find on my page
[DELETED]
Sunny1957
RedSon 5,000
Recognized Expert Expert
Hi Sunny,
This is an English only site. Please be sure to provide links to English language sites.
Thanks!
You did not ask how you might do the entire layout without using a table. This strikes me as strange, since you have no tabular data whatsoever. Nevertheless, it is your call. But, If your call might include the possibility of a ditching the 1990s table layout you are striving for in favor of producing a contemporary tableless CSS layout, let me know. I will try to help to help...
You did not ask how
This is a misunderstood, because I wouldn't ask something. My post should be the solution for question 2)
No combination has worked so that IE7 will display the table row without the slight padding at the bottom of the row.
of the thread opener Koelner. And also it should be the answer of question 3).
I can't get the center td's contents (a 1px by 1px graphic that I've stretched to 300 px) to align to the top in IE7.
In both cases, all to do is: remove the eol before </TD>
you have no tabular data whatsoever.
That's not correct. Ok it's a very small table, only 1 cell, and the data is no text, only a picture.
If you open my page and the right "table" ( produced by sample code ) in example 1 is identical to the left "table" ( hard coded picture ) in example 2 then you do not use IE7.
Otherwise you use perhaps Firefox 3.0.1. Other browsers/versions not testet.
Sign in to post your reply or Sign up for a free account.
Similar topics | |
by: Rowland |
last post by:
Hi,
I've got a field that stores numeric values, representing a tracking number.
I've also got a stored procedure that will extract this field and return it
to a client. However, I would like to return it slightly differently to the
way in which it is stored. Basically, I want to return it as TRK000nnn -
Where TRK is the string "TRK", 000 is zero-padding up to 4 zeros, and nnn is
the number itself - results would look something like...
|
by: Steve Sabljak |
last post by:
I seem to having a little trouble getting a table to display correctly
in both msie and firefox. I want to set the table and column widths in
pixels, and have some cell padding too. The table displays correctly
in standards compiance mode in firefox, but not msie, where the
padding is added on to the column widths.
the table size is always correct, but the column widths are not what I
expect them to be.
If I change the column widths to...
|
by: Dabbler |
last post by:
I need more space between my columns but increasing cellpadding increases
vertical spacing and the gridview flows below "the fold".
Is there some way to increase only horizontal padding? I tried setting
padding-left/padding-right in the row style but that did nothing.
Thanks.
|
by: Alan Silver |
last post by:
Hello,
In my (seemingly) endless quest to understand CSS, I have yet another
problem. Please look at http://www.kidsinaction.org.uk/ph/x.html in
Opera, where you will see it how I expected. If you look at it in IE (6
or 7), you find it also looks fine, except for the top margin missing
from the links across the top of the page. That's not the main issue
here, but any pointers as to why it doesn't show them would be
appreciated.
|
by: Andy Mabbett |
last post by:
Please can someone remind me of the most elegant fix for the way Firefox
fails to vertically align cell content by default?
For example, the second event on:
http://www.westmidlandbirdclub.com/diary/
Thank you.
--
| | |
by: Jessica M |
last post by:
I am having the following problem
http://jessica.ourprofile.net/
are being rendered differently on Firefox and IE6 (PC).
I have outline the div culprits in red to help with debugging.
Basically, the logo div sits about 10 pixels below the top of the page
in Firefox pushing content where I want it to be. IE does not push the
logo down and hence the problem.
|
by: Paradox |
last post by:
For some reason my cell padding isn't working in IE.
It works beautifully in Firefox but IE just seems to ignore it.
.maintable {
width: 800px;
padding: 8px 8px 0px 8px;
height: inherit;
|
by: shapper |
last post by:
Hello,
How can I define the cell padding and cell spacing of a table using a
CSS class?
Thanks,
Miguel
|
by: laszlokenez |
last post by:
Tested in IE7 and FF2. I have 2 frames, 2 similar tables in them,
similar CSS. (I have 1px cellpadding, and 1px border aroud the cells.
From one frame I read the offsetHeight of a cell (getElementById), and
set the height of the corresponding cell in the other frame. Here:
window.parent.frames.document.getElementById('r2').style.height=(document.getElementById('r2'i).offsetHeight)
+ 'px';
Everything works perfectly, cell gets...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed.
This is as boiled down as I can make it.
Here is my compilation command:
g++-12 -std=c++20 -Wnarrowing bit_field.cpp
Here is the code in...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
| | |
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own....
Now, this would greatly impact the work of software developers. The idea...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: TSSRALBI |
last post by:
Hello
I'm a network technician in training and I need your help.
I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs.
The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols.
I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: 6302768590 |
last post by:
Hai team
i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
| | |
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |
