Content shown in Desktop view, not visible on tablet or mobile views

Content for my Main page and about us page does not show up cleanly on Mobile Devices not sure where to begin to move stuff around to fit?? thought most of it would just be there waiting for minor adjustments… please check this out…

my link is https://preview.webflow.com/preview/americantroopsproject?preview=0dcfdcd9b1b5bed6f60b4328bc1ea6811

Can your check your read only link it isn’t working :smile:

https://preview.webflow.com/preview/americantroopsproject?preview=0dcfdcd9b1b5bed6f60b4328bc1ea681
see if this will work some how had an extra 1 at end?
thank you bruceo

Hi @bruceo, quick question, is your intent to try and build a site that is ONLY going to run on mobile devices ?

It looks like in the Desktop mode, there is applied some extreme fixed paddings and margins to the body element.

I just am trying to understand what the end goal is for the site design :slight_smile: Cheers, Dave

OK thank you so much for communicating… client wanted a large picture on homepage as a banner only… other pages have lots of info so I am hoping to scroll down to trigger different sections on the page??? 1/3 only showing … I would like to remove the blank spaces between content but only want one section to show at a time…

whole site is to be Responsive … needing tablet and ph views as well… noticed almost all content is not showing up in other breakpoint views…

Do I have to start with a smaller PICTURE on home page and remove strange margins and paddings so mobile devices auto show up or can we make this work where I am at…?

Not sure what to call the sections / containers etc divs to make the Aboutus page perform the way I wish … any and all ideas are welcomed… with videos and documentation…

I getting behind on this project… bruceo

all of the above assuming I remove the click buttons to go to sections… I was just playing with that concept and willing to REMOVE them immediately for another option… not sure I like the hidden and view button concept but would like hidden and view with scroll trigger…
bruceo

Hi Dave HOME page is unique as is… about us does the scroll thing… home page needs buttons for nav as you can see … about us page I need creativity so sections show up by a scroll action
sorry for the confusion … and yes this is a complete website for desktop view and all mobile views…

do i need to change the size of my banner on home page so mobile devices content shows up?

bruceo

Hi @bruceo, I understand, thanks. I am checking why the content is now showing up on mobile, will get back to you shortly with an update :slight_smile: Cheers, Dave

Also Dave I have not yet received an answer on how to go about CHANGING names of classes … I saw the video and it does not clearly show how to RENAME the classes… very very stuck on this as well… eager to get answers… client has been on the phone with me eager for me to get this rolled out. b

Hi @bruceo, you can change the name of classes from the Style Manager: http://help.webflow.com/general/designer-user-interface#style-manager-tab. Click the wrench icon to edit the style name. Any element having that style class assigned will also be updated :slight_smile:

I am checking the other issue, it does appear that the paddings and margins on the body are causing the issue on lower viewports.

I would suggest to not use padding or margins on the body, but rather, I would set the Section width to something like 50% width, with left and right margin set to Auto, to center the content horizontally on the page.

I am still looking at that. Cheers, Dave

Thank you I will do that on the home page… hopefully we will get better results on viewports… also thanks for the style name change … was in navigation not in the wrentch icon… b

Hi Bruce, for the home page, I made a quick video: http://quick.as/xwp4hzbm5

After you check the Home page stuff, then I am happy to also help check the About section scroll issue. I think you made a separate post on that, so I will go look on that post :slight_smile: Cheers, Dave

Thank you for the video… AWESOME to see how all this works… will cherish the video… please leave it up for a while… going in to do all that now… to home page… eager to learn more on the about us page… tks… much … bruceo

If I change the width on columns in a row while in the Tablet view does that mess up the needed results on the home page desk top view… if so I will need to find another approach to this some how. bruceo

CyberDave we have made progress… BUT tablet landscape and portrait phone look acceptable… and balanced… but I just cannot get the home page to look even on the outside of the left column and the right column in the row for HOME page… when in preview mode… looks ok in design mode… just cannot get this … do I need to use something other than a row with columns in it? can I place 3 divs side by side and get more control on the final outcome???
bruceo

Hi @bruceo, if you change the columns settings on a lower view, it affects all views. If you change the style for a class in lower views, it does not affect the same class on desktop view.

I would avoid making changes to column settings on lower views.

Using divs for structure does give you a lot more control :slight_smile:

Do you have some kind of picture, how you want it to look correctly aligned on desktop view? how should content in each column be aligned?

Cheers,
Dave

HI cyberdave, in the mockup on http://www.americantroopsproject.com/ I was going to add a box of content doing my own thing with CMS for the client on the HOME page only that is why it appears to be pushed to the left with a white space to the right… that is what I hope to do so in reality it could be considered 4 columns I think the column idea is bad for me… as I need to move the items in creative ways for each the Desktop view and each of the other views for mobile devices… this is challenging … if I have to leave off the CMS on home page which is going to be an IFRAME insert to index html code…

eager to see what you come up with for the about us page scroll / new section upload??? bruceo