May 31, 2014 at 1:27 am #107589
I am having an issue that I hope someone can help me with. To help me explain (and if you would oblige), please go to the Studiopress Responsive Testing Page and test my URL
As you can see the text in the blog post below my featured widget is overlapping with the widget. This only happens on smaller screen sizes when the responsiveness kicks in. The CSS element in question is the “home-featured-right" module. It currently houses the Genesis eNews extended email signup plugin and widget.
Why is this happening? Is it the eNews extended plugin or the CSS element "home-featured-right"? it is the last bit of responsive troubles I need to resolve.
Any help would be greatly appreciatedhttp://newtheme.jesseplautz.comMay 31, 2014 at 1:40 pm #107650nutsandboltsMember
From what I can tell, the issue is that your #home-featured div has a specific height of 360px assigned to it, while the Balance demo does not. If you remove that, it should clear the way it's supposed to.
May 31, 2014 at 3:47 pm #107669
Yes!!! Woohoo!! Thanks so much for the help. It worked immediately.
I know just enough "developing" to get me in trouble... 😉
Many, Many, Many Thanks.May 31, 2014 at 3:57 pm #107672
Now I of course have a follow up question...
As the screen width gets smaller the "home-featured-left" element gets disproportionately smaller than the "home-featured-right" element.
Why does this happen? I would prefer that they stay the same size...
again, any help will blow my mind.May 31, 2014 at 9:32 pm #107694nutsandboltsMember
Since home featured left is an image, it has to shrink to show the whole image without exceeding the padding assigned to the widget area. The opt-in has padding as well, but you don't notice it as much because its container has the red background color that goes full screen. (If you look at the opt-in text, though, it's exactly as wide as the image.) The opt-in is also smaller in the first place, so it doesn't have such a drastic reduction in size to fit onto mobile devices.
One alternative may be to remove the slider from the home featured left widget area (assuming you're only going to use the one slide) and to set that image as the #home-featured-left background, though you'd likely have to do a LOT of CSS tweaking to get it to display correctly. Alternately, you could hide that area completely on smaller mobile devices or adjust the padding in your media queries.
May 31, 2014 at 10:41 pm #107703
You were right once again. I ended up just using a text box with img src to display the featured image. The responsiveness looks a little better but I am willing to accept it for now.
Thanks so much!
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.