responsive standardtemplate

Support Area Forums Responsive Visual responsive standardtemplate

This topic contains 8 replies, has 2 voices, and was last updated by  Bill Robbins 2 years, 9 months ago.

Viewing 9 posts - 1 through 9 (of 9 total)
URL to the page in question: http://http://
  • Author
    Posts
  • #23080

    Thomas Pientka
    Participant

    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
    thomas

    Attachments:
    #23094

    Bill Robbins
    Keymaster

    Thomas,

    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

    #23148

    Thomas Pientka
    Participant
    This reply has been marked as private.
    #23159

    Bill Robbins
    Keymaster

    Thomas,

    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,
    Bill

    #23184

    Thomas Pientka
    Participant

    hey bill, this is looking good for the menu!

    #23185

    Thomas Pientka
    Participant

    hey 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

    #23192

    Bill Robbins
    Keymaster

    I 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.

    #23199

    Thomas Pientka
    Participant

    hey 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

    #23202

    Bill Robbins
    Keymaster

    Thomas,

    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

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

The topic ‘responsive standardtemplate’ is closed to new replies.