Custom CSS vertical alignment (DIV margins) work in Safari but doesn't align in Firefox and IE9

Recommended Posts

wworks
0

wworks 0

I am using pagelines framework. I added a few elements to the branding area and all looked fine in Safari, and Opera and some versions of IE. But then I tested it in Firefox and IE9.
The small navigation and the "apply now" button on the right side of the branding area causes (pushes) the navigation too low in the red bar. But if I fix the CSS margins for the - "#brandingright" it's too high for Safari and opera
How do I fix for one browser without breaking it in the other?

Share this post

Link to post

Share on other sites

wworks
0

wworks 0

Okay but now it breaks in Chrome and more importantly Safari.. The navigation jumped up as did the body of the page into the header section. Not good. Any ideas?
IE9 on windows looks fine
Firefox on Mac looks fine
Firefox on windows looks fine
Safari 5.1 on Mac - Bad
Chrome 20 on Mac - Bad
:(( :(( :((

Share this post

Link to post

Share on other sites

Rob
547

Rob 547

Unfortunately, they don't and while we endeavor to make everything work across browsers, we can't control how other companies code things, as I'm sure you understand.
Try this via our Store (it's free): http://www.pagelines.com/store/plugins/browser-css/?product_ref=true
It might help by applying CSS (such as I gave you) specific to the browsers badly affected by this issue.

Former PageLines Moderator, Food Expert and Raconteur

Share this post

Link to post

Share on other sites

wworks
0

wworks 0

I think I will install and try the pagelines browser specific CSS for this one. I just will have to figure out how to use it. It appears documentation is sparse. Thanks!
I was also looking at a javascript solution "CSS browser selector" Have you heard anything about that? it looked good. :) Plus it's easy to configure.