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

CSS padding question

Discuss CSS padding question in the CSS Help forum on Dev Shed.
CSS padding question Cascading Style Sheets (CSS) forum discussing all levels of CSS, including CSS1, CSS2 and CSS Positioning. CSS provides a robust way of applying standardized design concepts to your web pages.

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 16th, 2003, 11:33 PM
yeah-yeah yeah-yeah is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Sep 2003
Posts: 37 yeah-yeah User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 13 m 47 sec
Reputation Power: 5
CSS padding question
so i decided to twiddle with some css layout instead of using the ol' tables. my code is certainly cleaner, but doesn't seem to want to work the same on mozilla as it does on IE, specifically with the way the padding attributes are handled.

in mozilla, why is it when i specify a padding-left or padding-right attribute, the width of the div equals the width + padding-right + padding-left, and in IE, the width of the div is width? example:

#centerContent {
width: 620px;
float: left;
background: #505050;
padding-top: 13px;
padding-bottom: 13px;
padding-left: 8px;
padding-right: 8px;
}

in mozilla, the actual width of this div is 636px. in IE, it's 620px. i thought the padding just made sure the text had a buffer between it and the div boundary.

some clarification, pweeeze? thanks a bunch.
Reply With Quote
  #2  
Old November 16th, 2003, 11:45 PM
jharnois's Avatar
jharnois jharnois is offline
mod_dev_shed
Dev Shed God 19th Plane (14000 - 14499 posts)
  
Join Date: Sep 2002
Location: Atlanta, GA
Posts: 14,299 jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level)jharnois User rank is Major General (70000 - 90000 Reputation Level) 
Time spent in forums: 1 Month 1 Week 2 Days 1 h 54 m 17 sec
Reputation Power: 760
Quote:
in mozilla, why is it when i specify a padding-left or padding-right attribute, the width of the div equals the width + padding-right + padding-left, and in IE, the width of the div is width?
B/c the folks over at M$ can't read. The way Mozilla handles it is correct according to the W3C's specifications. As with most things, there is a workaround ... http://glish.com/css
__________________
# Jeremy

Explain your problem instead of asking how to do what you decided was the solution.
Reply With Quote
  #3  
Old November 17th, 2003, 12:13 AM
yeah-yeah yeah-yeah is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Sep 2003
Posts: 37 yeah-yeah User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 13 m 47 sec
Reputation Power: 5
that's the site that i've been using for examples. i looked in the hacks section but couldn't find the fix. i'm using IE 6 and the fixes all refer to IE5.x.

thanks for the help.
Reply With Quote
  #4  
Old November 17th, 2003, 05:10 AM
Akh's Avatar
Akh Akh is offline
|<.+#f@#+.&.|
Dev Shed Frequenter (2500 - 2999 posts)
  
Join Date: Mar 2002
Location: norway
Posts: 2,622 Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level)Akh User rank is Colonel (50000 - 60000 Reputation Level) 
Time spent in forums: 3 Weeks 6 Days 2 h 19 m 51 sec
Reputation Power: 548
make sure you use a doctype that triggeres the browers to render the page in standards-compliant mode.

http://www.hut.fi/u/hsivonen/doctype.html
Reply With Quote
  #5  
Old November 17th, 2003, 11:22 AM
yeah-yeah yeah-yeah is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Sep 2003
Posts: 37 yeah-yeah User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 13 m 47 sec
Reputation Power: 5
i used

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">

and it fixed one thing in IE, but broke another. apparently, IE cannot (or will not) render a DIV that's less than 5 px wide. mozilla renders it fine, but when i try and render a DIV with a width of 3px, IE renders it as 5px. eh, it's something i can live with, but i'll be happy in a few years when all the browsers render code the same (yes, i'm not holding my breath).

thanks a bunch!
Reply With Quote
  #6  
Old November 17th, 2003, 04:13 PM
INF INF is offline
Standards User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Mar 2003
Posts: 146 INF User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 6 m 4 sec
Reputation Power: 6
Quote:
Originally posted by yeah-yeah
... i'll be happy in a few years when all the browsers render code the same (yes, i'm not holding my breath).

thanks a bunch!


LOL! Me too! Although I think people have been saying that for years. Hopefully with "standards compliant" becoming more and more important, it won't be much longer. But like you, I won't hold my breath.
Reply With Quote
Reply

Viewing: Dev Shed Forums > Web Design > CSS Help > CSS padding question

« 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 3 hosted by Hostway.