question about RESPONSIVE layouts

[jmz1964]

I had previously been using a theme switcher to serve up different, mobile-themes, but now want to try SUFFUSION for mobile too. the only problem i can see so far is that the navigation bar below header does not respond on the mobile size. It stays super wide, while the header image responds:

http://www.james-baker.com/news/

I have a FIXED WIDTH at full size, but even if I change it to FLUID it makes no difference. any tips

[drake]

At Suffusion Options -> Layouts -> Responsive Layouts can set different breakpoint resolutions from where Navigation Bars become select lists.
And for sure need to change the widths to fluid for having a responsive layout.

[jmz1964]

I have the FLUID setting turned on. But when i look at my site on my mobile, the NAVIGATION BAR (black MENU strip beneath my header) extends way off-screen to the right, and distorts the fluidity of the page. Maybe there is still a setting turned on somewhere? Take a look:

http://www.james-baker.com/news/

[drake]

Your navigation bar still look like fixed one of 1000px... Also the footer. At Custom Styles add:

Code: Select all

#nav, #page-footer .col-control {width: 100%;max-width: 1000px;min-width: 0;}

[jmz1964]

Thank you. I added the code you provided. The extended nav bar is now gone on mobile, but there is the same amount of white space there (i.e.; possible to scroll to the right, though there is no text/images etc)

[drake]

Continue to add at Custom Styles:

Code: Select all

#header-container .col-control {width: 90%;min-width: 0;}

[jmz1964]

Oh thank you! How do you find the solutions? I don't even know where to look most of the time

[drake]

Inspect Elements... and probably more experience

[jmz1964]

I really must thank you for all the help you have given me. That tip about SUFFUSION for mobile was great! I often do not know a the things it can do!

By the way, was there something wrong with my site before? Or a bad plugin? Otherwise Why would the extra CSS be needed for my too-wide header?0

[drake]

No, I don't know why... maybe because we used a fixed width for sites, sometimes the elements from the above codes remains at fixed widths... The codes just change them to fluid widths. I prefer to not lose time with "why", but I concentrate on "how"