944,134 Members | Top Members by Rank

Ad:
Jul 10th, 2007
0

Doctype difficulties

Expand Post »
I have never used DOCTYPES on my websites, but I noticed that with my current coding, adding padding to an image only shows up in Firefox, but not in IE (ex: http://avrilhq.com - "T in the Park Photos" update on 10 Jul 2007). I noticed that other sites with this effect have doctypes.

When I added a doctype (any doctype - I've tried them all), the padding shows in the images in IE, and everything looks fine, however it now looks like this: http://img338.imageshack.us/img338/2159/messedupvq8.jpg in Firefox. It seems like nothing can look right in both browsers. Is something I can do to fix this? Thanks in advance?
Last edited by Evanzgurl; Jul 10th, 2007 at 8:38 pm.
Similar Threads
Reputation Points: 10
Solved Threads: 0
Newbie Poster
Evanzgurl is offline Offline
15 posts
since Aug 2005
Jul 13th, 2007
0

Re: Doctype difficulties

The problem is not doctypes, but the actual difference in the way IE and Firefox treat box objects.

When you define the size of a box object, IE uses that size as the outside edge of the margin. So the margin, border, and padding are all INSIDE that dimension.

When you define the size of a box object, FF uses that size as the inside edge of the padding. So the margin, border, and padding are all OUTSIDE that dimension.

So the trick is to make sure the box object you define a size for has no margin, border, or padding.

Your images are breaking apart, which means they are not uploaded as single images. Why are you doing that? It's stupid. Upload images as complete image files, and they will stay together.

I can see where padding or margins on objects causes the sliding over of some objects. Use the following style as a class to take away these attributes from your box objects, and they will fit together properly:

[code]
.fxbox {margin: none; border: none; padding: none;}
Last edited by MidiMagic; Jul 13th, 2007 at 6:45 am.
Reputation Points: 730
Solved Threads: 181
Nearly a Senior Poster
MidiMagic is offline Offline
3,314 posts
since Jan 2007

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in HTML and CSS Forum Timeline: Javascript / css menu image help, pls?
Next Thread in HTML and CSS Forum Timeline: display problem with diffrent browser.





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC