responsive standardtemplate
Support Area › Forums › Responsive Visual › responsive standardtemplate
- This topic has 8 replies, 2 voices, and was last updated 9 years, 6 months ago by Bill Robbins.
-
AuthorPosts
-
October 10, 2014 at 08:47 #23080Thomas PientkaParticipant
hi bill, i don’t know if it’s because we put the menu on top of the content, but somehow the responsive layout of a standardtemplate page with a feature image and text content is messed up.
1) the image resizes but it gets a grey bar on top. the height is equal to the height of the menu (so i thing it’s causing the issue).
2) you cannot see any content below (i think because it’s because of a given height), it gets cut.
you can see in the screenshot what’s going on.thanks
thomasAttachments:
October 10, 2014 at 09:45 #23094Bill RobbinsModeratorThomas,
I’d be glad to take a look for you. Can you send over the URL to that page? It’ll help me, help you out.
Bill
October 12, 2014 at 18:24 #23148Thomas PientkaParticipantThis reply has been marked as private.October 13, 2014 at 09:28 #23159Bill RobbinsModeratorThomas,
On smaller screen sizes, the navigation menu gets position: relative instead of absolute. You could try changing it to position: absolute like this:
@media only screen and (max-width: 767px) { #nav-bar { position: absolute; } #home-sidebar, #panel { height: 500px; } }
That also sets a height for the scroll panel so it doesn’t disappear anymore since the default height was overridden earlier.
Hope that points you in the right direction.
Enjoy your week,
BillOctober 14, 2014 at 05:32 #23184Thomas PientkaParticipanthey bill, this is looking good for the menu!
October 14, 2014 at 05:32 #23185Thomas PientkaParticipanthey bill, this is looking good for the menu!
is it possible to have the whole text content underneath the picture?
for mobile users you will have a scrollable content plus a scrollbar on the side from the browser of the phone. it would be cool only to have that browser scrollbar and see the whole text.
i tried to set the height to auto, but this will shrink it to the beginning.
i noticed that in responsive mode you put the text content from the home slide also underneath in a box with a given height. on a normal page without picture everything works fine (you can see the wohle content no matter how long it is).thomas
October 14, 2014 at 09:20 #23192Bill RobbinsModeratorI think it’s just that the home page has less content so it doesn’t have to scroll. If I look at the home page on the demo, it has a scroll bar.
You’re welcome to experiment.
October 14, 2014 at 12:20 #23199Thomas PientkaParticipanthey bill maybe you misunderstood. if the content is under the picture the height of that div is set.
so if there is more content a scrollbar will be on the right. that’s fine in desktop mode. but inconvienant for mobile users. also this can lead to another layout issue: i set the height to: 515px which is good for the content for the vita page. at the home page i have to lines saying hello.
in dekstop mode this is no problem (it’s on the right overlay of the image).
but in mobile mode this makes the vita page with a scrollbar and the homepage without a scrollbar but a 500px box that is obviously not filled with any content.so it would be cool to set the height of the #home-sidebar, #panel not to a special px but let the content be the decision. this will make the whole layout more persistent and reliable.
thomas
October 14, 2014 at 13:15 #23202Bill RobbinsModeratorThomas,
I do believe I understand what you’re describing. It’s been quite a while since this theme was built, but I believe I had to set a height to that container in order to keep it from being collapsed by the JavaScript that provides for the scroll bar there.
You’re welcome to experiment if you’d like to, but your on your own there.
Take care,
Bill -
AuthorPosts
- The topic ‘responsive standardtemplate’ is closed to new replies.