Responsive Design CSS Thresholds

Community Forums Forums Design Tips and Tricks Responsive Design CSS Thresholds

This topic is: resolved

This topic contains 3 replies, has 2 voices, and was last updated by  jbculp 1 year, 4 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #56824

    jbculp
    Participant
    Post count: 119

    I’ve tested a couple of my sites in the Genesis Mobile Responsive tool as well as some live testing on devices and by resizing my browser. In each case I have unexpected non-responsive elements or “dead spaces” where at a given size range the header goes blank etc.

    Instead of trying to trouble shoot this one element at a time, I need to understand how the general framework for mobile responsiveness works within the CSS. I like the idea of having individual control over elements with CSS for given sizes vs just shrinking everything but need to get my brain around the overall framework.

    Can anyone point me to a good article on how this is configured in a Genesis Theme and how I can tweak the different responsive “thresholds”?

    Thanks

    #56914

    AC
    Blocked
    Post count: 7712

    Can you provide the links to your sites so we can assist you better. Most times there are things that are site specific.

    #56919

    jbculp
    Participant
    Post count: 119

    Well, here is my wife’s blog . I just realized however that yesterdays work of converting it to HTML5 blew away the header responsiveness so I’ll have to try to roll that back before I can make my point. Let me update this when I’ve accomplished that task. sorry.

    #56923

    jbculp
    Participant
    Post count: 119

    OK, All good now. I had a pre-HTML5 version of my style.css so I restored that and removed HTML5 support form the functions.php. Here is the Blog again.

    That said, this site has some of what I called “dead spaces” where the responsive header disappears. It’s in the 800px range but I can’t give an exact number without more investigation. It self-corrects around 1024px or so. Since the responsive header plugin is working I was asking my question about the general design framework so I could learn how to tweak my CSS to accommodate any areas that are not quite up to snuff. Any pointers to articles on responsive design for css would be helpful.

    Thanks

    jc

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

You must be logged in to reply to this topic.