Hi I installed your child theme NomNom 1.6 and I'm very happy with it. You did a great job! Two problems I can't solve for myself. The first one is in this thread, the second in an other thread. When I open the site for example with an iPhone I get: - the first menu, then the header, then the menu, then text and picture of the content (until here everything is ok), but then the widgets of the right sidebar, then the widgets of the left sidebar and at the end the footer. 1a. How can I change this order to menu, header, menu, content, left sidebar, right sidebar, footer? 1b. How can I change this order to menu, header, menu, left sidebar, right sidebar, content, footer? P.S.: Sorry, the site is closed because the site is not ready to make it public. If you have time and energy to have a look into it I can give you a login via PN or Mail. Regards hama
The problem happens in the "three column layout - left and right sidebars". This is the original part of style.css: Code: /* Three Column layout - left and right sidebars ------------------------------------------------------------------------ */ .three-column #page { max-width: 1000px;} .three-column #primary { float: left; margin: 0 -26.4% 0 0; width: 100%; } .three-column #content { margin: 0 34% 0 26.4%; width: 46.4%; } .three-column #secondary { float: right; margin-right: 2.6%; width: 20.8%; } .three-column #extra-sidebar{ position:relative; float: left; width: 20.8%; margin-left: -70%; } Do you have an idea how I can fix that? Regards hama
Is there a chance to get a bit help or is it not possible to change the order of the sidebars? Thanks for an answer. hama
Hi Hama. The responsive layout is controlled by Twenty Eleven theme. In Twenty Eleven style.css search for /* =Responsive Structure The only thing I did was add a bit of CSS for the extra sidebar (for 3 column layouts and anywhere the extra sidebar is used) to match the behavior of the default sidebar, which is move to the bottom. Here is the CSS I used. Code: /* Extra sidebar fix for narrow browsers/media devices */ @media (max-width: 800px) { .custom-layouts #main #extra-sidebar{ float: none; margin: 0 7.6%; width: auto; } } After a quick Google search, I found a post on Wordpress.org forums http://wordpress.org/support/topic/sidebar-gone-on-frontpage-when-using-mobile , I remember someone else asking how to keep the sidebars where they are on an Ipad. This is what was recommended. Add this to the end of NomNom Style.css This will need to be modified for the proper classes for whatever layout you're using. Code: /* =Responsive Structure for narrow screens * to keep min width and sidebar -------------------------------------------- */ @media (max-width: 800px) { #page { min-width: 500px; } /* keep the sidebar - for right sidebar */ .right-sidebar #main #content { margin: 0 29% 0 1%; width: 70%; } .right-sidebar #main #secondary { float: right; margin: 0 1% 0 1%; width: 24%; } /* keep the sidebar - for left sidebar */ .left-sidebar #main #content { margin: 0 1% 0 29%; width: 70%; } .left-sidebar #main #secondary { float: right; margin: 0 -1% 0 2%; width: 24%; } /* correction for 'showcase' template */ .page-template-showcase-php #main #primary.showcase { float: right; margin: 0 2% 0 2%; width: 96%; } .page-template-showcase-php #main #primary.showcase #content { margin: 0 6% 0 6%; width: 88%; } .page-template-showcase-php section.recent-posts { float: right; margin-right: 0pt; margin-left: 31%; width: 69%; } .page-template-showcase-php #main .widget-area { float: left; margin-right: -22.15%; margin-left: 0pt; width: 22.15%; } /* correction for singular posts/pages without sidebar */ .singular #main #content { margin: 0 8% 0 8%; width: 84%; } }
Hi Zeaks Can you explain your following sentence in connection with my activated "Three column layout - left and right sidebars" layout, please? --> "This will need to be modified for the proper classes for whatever layout you're using." Thanks hama
