Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
08-13-2009, 07:10 PM #1
- Join Date
- Apr 2009
- Thanked 0 Times in 0 Posts
Internet Explorer Div Spacing Problems
Here is the site: http://www.cmcconnell.com/web/web.html
You'd think I could figure this out, but I am having trouble with the spacing underneath each portfolio item, which are all #portfolio-item-box.
There should be 20px of space under each portfolio item, and it works fine to add 20px of either padding or margin or even a 20px white bottom border in Firefox - but I can't get this to work in IE. Is this margin collapse even though it doesn't work with padding or a white border??
Urgent issue - please help!
08-13-2009, 07:20 PM #2
- Join Date
- Oct 2008
- Some say it's everything.
- Thanked 397 Times in 390 Posts
First things first, we have 40 errors showing up right now in the HTML:
The majority of these appear to be due to using certain IDs more than once in a page. Change these items to classes instead of IDs (and remember to change the "#" to a "." in the CSS for each). The rest of the errors look to be some issues with the footer's menu. I'll let you sort those out.
Now, from what I can see you have only added
margin-bottom:20px;to "portfolio-item-box" which would be the cause of the problem (margin collapsing as you mentioned earlier). Change that to
padding-bottom:20px;and you should be all set.
Also, you have a bit of "divitis" in there. For example, using a div to wrap an image for your portolio items is totally unnecessary. You might want to streamline things like that a bit.
The object of opening the mind, as of opening the mouth, is to shut it again on something solid. –G.K. Chesterton
See Mediocrity in its Infancy
It's usually a good idea to start out with this at the VERY TOP of your CSS:
Seek and you shall find... basically: validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting