News Theme – Firefox Issue

Community Forums Forums Showcase and Feedback News Theme – Firefox Issue

Tagged: , ,

This topic contains 7 replies, has 2 voices, and was last updated by  timmarchant 1 year, 1 month ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #55992

    timmarchant
    Participant
    Post count: 4

    Hi

    I have been having a problem with the News theme (awesome theme). In Firefox when the responsive view switches in i.e. when the @media only screen and (max-width: 960px) rule is applied the text in the #content div flows off the right side of the page and is hidden from view. The theme works fine in IE/Safari/Chrome, only FIrefox seems to be effected.

    I have, I think, got a fix for this using Firefox specific CSS. I have appended the following rule to the foot of style.css and it seems to work.

    @-moz-document url-prefix() {
    @media only screen and (max-width: 960px) {
    #content {max-width:93%}
    }
    }

    This is the first time I have ever had to use FF specific CSS, so I am a bit worried that I am going to hit some snag with this approach.

    http://felixstowechamber.co.uk/
    #56025

    AC
    Blocked
    Post count: 7712

    I viewed in my Firefox. Use this responsive tool – http://cre8tivediva.com/responsive/. Add your url and hit enter. Do you see it out of sorts in the test windows in Firefox?

    #56027

    AC
    Blocked
    Post count: 7712

    This is how I would fix this. Change 35px to 25 and it will balance the left and right padding.

    #content {
    float: left;
    padding: 25px 35px;
    width: 430px;
    }

    #56034

    timmarchant
    Participant
    Post count: 4

    Thanks, but no, that doesn’t work and it changes the layout (makes it wrong) in other browsers.

    Nice tool for showing clients responsive views, I just teach them to use Ctrl Shift M like I do.

    Tim

    #56037

    AC
    Blocked
    Post count: 7712

    Thanks for sharing your method. I never new that existed. As for the coding, responsive is just that trial and error type of thing. Hope that fix works for the long haul for you.

    #56048

    timmarchant
    Participant
    Post count: 4

    :-) I only found that by accident, it is tucked away in the developer options menu.

    I prefer to fix things with code which will work for everything but I can’t work out why FF is different, I have tested the demo theme and that is wrong too.

    #56060

    AC
    Blocked
    Post count: 7712

    Normally things work great in Firefox. You can always send out a tweet on twitter and use hashtag #GenesisWP to see if someone from there can help you.

    #56068

    timmarchant
    Participant
    Post count: 4

    Yes, I love Firefox, I tend to code css in Firefox using EditCSS and then rejig if there are problems in other browsers. I have always tried to avoid browser specific code, even back with IE4/5, you could mostly get things to be pretty consistent without it.

    Until today, I didn’t even know you could write stuff for FF like that so this has been a good day, I have learned something new, :-)

    Thanks again for your input.

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.