peranha Posted September 3, 2009 Share Posted September 3, 2009 How can I add a padding to the bottom of the div in firefox only? I have a div that in IE and Chrome there is a white space between the footer and the main div of the page, but on firefox the main div and the footer all run together. Adding padding: 0 0 5px 0; will add the padding in all browsers, and does not look good in IE and Chome. Quote Link to comment Share on other sites More sharing options...
Zane Posted September 3, 2009 Share Posted September 3, 2009 try actually using px on all of them padding: 0px 0px 5px 0px; Quote Link to comment Share on other sites More sharing options...
peranha Posted September 3, 2009 Author Share Posted September 3, 2009 I dont want to use padding as it pads all browsers, I need something that will just pad firefox, not IE and Chrome. Here is a pic of firefox and Chrome. In Chrome there is a space between the last post and the footer, but in firefox there is no space, they run together. I want the space in there, but without affecting the other 2 browsers if possible. [attachment deleted by admin] Quote Link to comment Share on other sites More sharing options...
haku Posted September 5, 2009 Share Posted September 5, 2009 It's almost definite that you ahve errors in your code. If your code is valid, and you code it in FF, it will 99.9% of the time look exactly the same in Chrome. Then you can add a few IE only fixes. Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted September 5, 2009 Share Posted September 5, 2009 The problem is probably caused by bottom-margins not working cross browser. Make sure you declare are bottom and top margin to 0. Quote Link to comment Share on other sites More sharing options...
saltedm8 Posted September 6, 2009 Share Posted September 6, 2009 ok, in your css, you need to reset the margins and paddings like this * {margin-bottom:0; padding:bottom:0;} yea, you can use a star, or if you prefer you can use the body tag the same way then you can use #yourdivid {padding-bottom: 5px;} to your div, or whatever you require if you wanted to reset the whole site you could use *{margin:0; padding:0;} instead, but that might mess your layout up a bit at this stage because it will also remove the natural paddings and margins off some elements, like <h1> etc tags, <p> tags etc etc... Quote Link to comment Share on other sites More sharing options...
Zane Posted September 6, 2009 Share Posted September 6, 2009 just a revision to your code * {margin-bottom:0; padding-bottom:0;} Quote Link to comment Share on other sites More sharing options...
saltedm8 Posted September 6, 2009 Share Posted September 6, 2009 did not spot that hehe cheers Quote Link to comment Share on other sites More sharing options...
peranha Posted September 6, 2009 Author Share Posted September 6, 2009 Thanks. For some reason Chrome and IE put a 10px space after you end a < p> tag, but firefox doesnt. I dropped the p tags, and put everything in divs. Quote Link to comment Share on other sites More sharing options...
Zane Posted September 6, 2009 Share Posted September 6, 2009 just a revision to your code * {margin-bottom:0; padding-bottom:0;} I'm not sure if it's considered good practice or good etiquette..I'm no award winning CSS mastermind or anything like that, but I always put that line at the top of my stylesheets maybe it's been written in a book already somewhere and I didn't know it..but I do anyway Quote Link to comment Share on other sites More sharing options...
saltedm8 Posted September 6, 2009 Share Posted September 6, 2009 all it is, is a 'fix', so there is no 'is this right or not', there is only 'is it necessary' my personal view is if its not broken don't fix it.. in other words, if I don't think I am going to need a particular 'fix' because I am not expecting a problem relating to it I wont use it as using some fixes can cause issues in themselves, making your coding heavier than it needs to be. Quote Link to comment Share on other sites More sharing options...
haku Posted September 7, 2009 Share Posted September 7, 2009 Thanks. For some reason Chrome and IE put a 10px space after you end a < p> tag, but firefox doesnt. I dropped the p tags, and put everything in divs. That really was the wrong way to do it. Glad it worked, but you would be good off spending time learning about CSS properly so that you don't need to wreck everything just to change one little thing that could have been fixed so many better ways. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.