Jump to content
Sign in to follow this  
glynt

margin CSS different for different browsers

Recommended Posts

glynt    1
glynt

Hi all, I have added the following custom CSS: .home #pagelines_content { margin-top: -25px !important; margin-bottom: -20px !important; margin-left: -10px !important; margin-right: -10px !important; } The bottom margin value seems to differ in its effects depending on browser. It is right where I want it to be in Safari, slightly different in Chrome and way out in Firefox. The other commands seem to work fine across all browsers. Website is: www.benidorm-selections.com theme is PlatformPro. Many thanks for any ideas!! Glyn

Share this post


Link to post
Share on other sites
glynt    1
glynt

Hi Catrina, It's too large by a long way in Firefox. Slightly too large in Chrome, and just right in Safari.... Thanks, Glyn

Share this post


Link to post
Share on other sites
glynt    1
glynt

Hi Catrina, Thanks, but I'm not sure it helps much (unless I'm missing something...) All margins are fine apart from the bottom one, and the code included in the article for don't seem to give me any more options... Thanks, Glyn

Share this post


Link to post
Share on other sites
catrina    103
catrina

Have you already tried adjusting the top margin for the content below the content you've adjusted?


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
glynt    1
glynt

It's a row of boxes so I've had a quick stab at it with a few bits of code that I've found on the forum, along the lines of: #fbox .content {margin-top: -10px} but haven't got anywhere. Do you know the correct code? thanks,

Share this post


Link to post
Share on other sites
kastelic    6
kastelic

Okay this is actually the code that is causing the issue. The problem, i think, is that different browsers calculate

em
relative to different elements.
.fpost {
	    margin-bottom: 1.6em;
	}
So if you add this:
.fpost {
	    margin-bottom: 0px !important;
	}
it will cancel out that margin, and you can get rid of the negative margin you were putting on the bottom of
#pagelines_content

.

Share this post


Link to post
Share on other sites
glynt    1
glynt

Brilliant, that's worked perfectly! Thanks very much!

Share this post


Link to post
Share on other sites
Simon    247
Simon

Its actually possible target specific browsers within wordpress

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×