Web Design Help
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me
Go Back   Dev Shed Forums > Web Design > Web Design Help
Reload this Page

Tables & Browsers

Discuss Tables & Browsers in the Web Design Help forum on Dev Shed.
Tables & Browsers Web Design Help forum discussing topics such as video editing, audio editing, animation, etc. This is also the place to get recommendations on preferred web authoring tools.

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
« Previous Thread | Next Thread »  
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Dev Shed Forums Sponsor:
  #1  
Old November 26th, 2004, 11:05 PM
openXS openXS is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jul 2004
Location: /usr/bin
Posts: 6 openXS User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 0
Send a message via ICQ to openXS Send a message via MSN to openXS Send a message via Yahoo to openXS
Tables & Browsers
Hi Folks,

I'm having a problem aligning the tables to display correctly in Both IE and Mozilla. Sometimes, it looks good in IE, but not in Mozilla and so on..

Following is the table code:

Code:
<center>
  <table border="0" cellpadding="0" cellspacing="0" align="center" width="99%"><!--DWLayoutTable-->
    <tr>
      <td width="33%" height="112"><div class="description" style="width: 234; height: 112">
    <p align="justify" style="line-height: 150%; margin-top: 0; margin-bottom: 0">
    <strong>BlahBlah</strong>
    
    <p align="justify" style="line-height: 150%; margin-top: 0; margin-bottom: 0">
	blah blah blah blah blah blah blah blah blah blah blah blah blah blahblah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah 
    <hr noshade>
    <p style="line-height: 150%; margin-top: 0; margin-bottom: 0"><a href="/advertiser.php" class="style10"><strong>Learn
    More</strong></a>  |  <a href="/signup.php?advertiser" class="style10"><strong>Signup</strong></a></div></td>
      <td> </td>
      <td width="33%" height="112"><div class="description" style="width: 234; height: 112">
    <p align="justify" style="line-height: 150%; margin-top: 0; margin-bottom: 0">
	<strong>Partner</strong>
    
    <p align="justify" style="line-height: 150%; margin-top: 0; margin-bottom: 0">
 blah blah blah blah blah blah blah blah blah blah blah blah blah blahblah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
    <hr noshade>
    <p style="line-height: 150%; margin-top: 0; margin-bottom: 0"><a href="/advertiser.php" class="style10"><strong>Learn
    More</strong></a>  |  <a href="/signup.php?advertiser" class="style10"><strong>Signup</strong></a> </div></td>
      <td> </td>
      <td width="33%" height="112"><div class="description" style="width: 234; height: 112">
    <p align="justify" style="line-height: 150%; margin-top: 0; margin-bottom: 0">
	<strong>Help us Improve</strong>
    
    <p align="justify" style="line-height: 150%; margin-top: 0; margin-bottom: 0">
	blah blah blah blah blah blah blah blah blah blah blah blah blah blahblah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
    <hr noshade>
    <p style="line-height: 150%; margin-top: 0; margin-bottom: 0; font-family: Verdana;"><a href="/signup.php?advertiser"><strong>Feedback</strong></a>      </div></td>
    </tr>
  </table>
  </center>


Following is the css class used:

Code:
.description , .articles{ font-family:"Microsoft San Serif", Tahoma, Verdana, sans-serif; font-size:11px; line-height:13px; padding:5px; border:solid 1px #999; background-color:#F7F7F7;}
.description{ margin-top:10px; background-color:#F7F7F7;}


I need to align these 3 tables in a way that they look EXACTLY the same in both ie and mozilla. For now, they are not aligned correctly, as I said earlier, if it looks good in mozilla, it goes out of the page in IE.

Please help. Thanks.
Reply With Quote
  #2  
Old November 27th, 2004, 10:39 AM
000000000 000000000 is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Nov 2004
Posts: 14 000000000 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 27 m 17 sec
Reputation Power: 0
Quote:
Originally Posted by openXS
I need to align these 3 tables in a way that they look EXACTLY the same in both ie and mozilla. For now, they are not aligned correctly, as I said earlier, if it looks good in mozilla, it goes out of the page in IE.


I experienced the exact same problem in the last website I built. I spent several days to trying to solve the problem, but to no avail. The problem is that IE and Mozilla read and draw tables differently. In my experience Mozilla was more accurate most of the time. But sometimes it wasn't wheras IE was. You will need to play around with your code and try to find the perfect balance between the two browsers. Sometimes you might get it exact, other times you may have to make a decision between the two.

Good Luck!!
Reply With Quote
  #3  
Old November 27th, 2004, 11:51 AM
the tree's Avatar
the tree the tree is offline
ub0r 7r0|| flam3r
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jul 2004
Location: Near enough to London
Posts: 483 the tree User rank is Corporal (100 - 500 Reputation Level)the tree User rank is Corporal (100 - 500 Reputation Level)the tree User rank is Corporal (100 - 500 Reputation Level)the tree User rank is Corporal (100 - 500 Reputation Level) 
Time spent in forums: 17 h 8 m 24 sec
Reputation Power: 7
Send a message via MSN to the tree
Quote:
Originally Posted by Your immense and quite ugly code
<!--DWLayoutTable-->
Tables are not for layout, it's as simple as that. If you missuse HTML like that then you will get proplems, if you do it with 100% css your problems will be instantly reduced.
Reply With Quote
  #4  
Old November 27th, 2004, 12:12 PM
openXS openXS is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jul 2004
Location: /usr/bin
Posts: 6 openXS User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 0
Send a message via ICQ to openXS Send a message via MSN to openXS Send a message via Yahoo to openXS
Quote:
Originally Posted by the tree
Tables are not for layout, it's as simple as that. If you missuse HTML like that then you will get proplems, if you do it with 100% css your problems will be instantly reduced.


Oh! But I'm not a CSS Veteran, can you please help me fix this, everything else on other pages seems to be coming good except this.

Thanks.
Reply With Quote
  #5  
Old November 27th, 2004, 12:34 PM
jabba_29's Avatar
jabba_29 jabba_29 is offline
Back in HEL
Click here for more information.
  
Join Date: Feb 2002
Location: Finland
Posts: 8,910 jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)jabba_29 User rank is General 11st Grade (Above 100000 Reputation Level)  Folding Points: 57777 Folding Title: Beginner FolderFolding Points: 57777 Folding Title: Beginner FolderFolding Points: 57777 Folding Title: Beginner Folder
Time spent in forums: 3 Months 4 Weeks 1 Day 10 h 50 sec
Reputation Power: 1693
Send a message via ICQ to jabba_29 Send a message via AIM to jabba_29 Send a message via MSN to jabba_29 Send a message via Yahoo to jabba_29 Send a message via Google Talk to jabba_29 Send a message via Skype to jabba_29
Facebook
Quote:
if you do it with 100% css your problems will be instantly reduced.
Not completely true - however the snip you took highlighted the biggest problem:
Code:
<!--DWLayoutTable-->

try learning some basic HTMl instead of relying on a WYSIWYG. You are using old and / or obsolete code and bad mark-up. It is not suprising that it doesn't work in Mozilla correctly - IE is more forgiving
__________________
Cheers,

Jamie

# mdb4u | mobile movie database] | Please help to test and promote
# skiFFie | Home of the 'accessibility module' for Drupal
# Jamie Burns [me] Accessibility Module [drupal]
# guidelines | search | wap resources | not getting help | fold to cure

__________________

Let the might of your compassion arise to bring a quick end
to the flowing stream of the blood and tears .....
Please hear my anguished words of truth.


__________________
Reply With Quote
  #6  
Old November 27th, 2004, 01:00 PM
openXS openXS is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jul 2004
Location: /usr/bin
Posts: 6 openXS User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 0
Send a message via ICQ to openXS Send a message via MSN to openXS Send a message via Yahoo to openXS
Right. I know I'm not good (at all) at css or even HTML but everything else is coming up fine except this. Can you PLEASE help me fix this.

Thanks
Reply With Quote
  #7  
Old November 27th, 2004, 03:34 PM
the tree's Avatar
the tree the tree is offline
ub0r 7r0|| flam3r
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jul 2004
Location: Near enough to London
Posts: 483 the tree User rank is Corporal (100 - 500 Reputation Level)the tree User rank is Corporal (100 - 500 Reputation Level)the tree User rank is Corporal (100 - 500 Reputation Level)the tree User rank is Corporal (100 - 500 Reputation Level) 
Time spent in forums: 17 h 8 m 24 sec
Reputation Power: 7
Send a message via MSN to the tree
Quote:
Originally Posted by openXS
Can you PLEASE help me fix this.
O.k. I have never done this before, but here is a vaugely complete fix. See how much smaller CSS code is?
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <title></title>
 <style type="text/css">
 div {float: left; max-width: 30%; margin-left: 5px}
 </style>
 </head>
 <body>
 <div>
 <h3>BlahBlah</h3>
 <p>blah blah blah blah blah blah blah blah blah blah blah blah blah blahblah blah blah 
 
 blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah 
 
 blah blah blah blah</p>
 <hr />
 <p><a href="#">Lynx etc</a></p>
 </div>
 <div>
 <h3>BlahBlah</h3>
 <p>blah blah blah blah blah blah blah blah blah blah blah blah blah blahblah blah blah 
 
 blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah 
 
 blah blah blah blah</p>
 <hr />
 <p><a href="#">Lynx etc</a></p>
 </div>
 <div>
 <h3>BlahBlah</h3>
 <p>blah blah blah blah blah blah blah blah blah blah blah blah blah blahblah blah blah 
 
 blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah 
 
 blah blah blah blah</p>
 <hr />
 <p><a href="#">Lynx etc</a></p>
 </div>
 </body>
 </html>
Reply With Quote
Reply

Viewing: Dev Shed Forums > Web Design > Web Design Help > Tables & Browsers

« Previous Thread | Next Thread »

Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Linear Mode Linear Mode
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump


Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 





© 2003-2008 by Developer Shed. All rights reserved. DS Cluster 6 hosted by Hostway.