On my site
Safari issue and YUI CSS Reset
4 replies to this topic
Posted 14 March 2012 - 11:31 AM
On my siteI've reduced the bottom margin on the logo in the header to move it down so it displays into / near the menu nav below. This looks good in Firefox and IE but in Safari the company logo displays further down so I've added safari specific css to improve this. However I can't get it quite right, the logo seems to jump to above the menu nav or below it and into the graphic below when you change it by 1px. I'm using YUI CSS Reset (Contextual) in the Custom code - Headerscripts Code area ( ) - to help with cross browser issues and I'm using the Pagelines Browser Specific CSS plugin to allow me to add some specific css for Safari. There seems to be a difference when the YUI CSS Reset code is implemented in Safari compared with Firefox and IE. So two questions initially... 1) Have I put the YUI CSS Reset code is the right place? 2) Is there another way I can move the logo down instead of reducing the bottom margin on the logo image that perhaps wont cause these issues in Safari? Thanks in advance, Tracy. @-)
Posted 14 March 2012 - 12:25 PM
Hi Tracy, Would it be possible for you to take a screenshot of how this is supposed to look, as when I view it in Chrome, Firefox and Safari, I am seeing the layout differently.
Posted 14 March 2012 - 02:02 PM
Thanks Danny, I've not looked at it in Chrome yet! Here is a shot of it in Firefox 10.0.2 - this is how I want the top to look, the logo is in the right position here...Cheers.
Posted 15 March 2012 - 02:39 AM
1) Yes, you did place the YUI code in the right place (Headerscripts Code). 2) I don't know any way other than with the margin. Have you considered increasing the top margin?
Posted 15 March 2012 - 02:17 PM
Thanks for that suggestion Catrina, I've adjusted the margins elsewhere and added some more browser specific code and it's looking a lot better now. Liking the Pagelines Browser Specific plugin - works a treat! Thanks again, Tracy.