Title: Responsiveness customization Last modified: February 7, 2017 --- # Responsiveness customization * Resolved [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/) * (@fabio-nunes-souza) * [9 years, 4 months ago](https://wordpress.org/support/topic/responsiveness-customization/) * Hi please how do I customize the css on mobile version? to I change menu’s backgrond- color etc * Gracefully Viewing 13 replies - 1 through 13 (of 13 total) * [stephencottontail](https://wordpress.org/support/users/stephencottontail/) * (@stephencottontail) * [9 years, 4 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8754882) * In general, you can use [@media](https://wordpress.org/support/users/media/) queries to write CSS that only applies when the browser window is a certain size: * ``` @media screen and (max-width: 800px) { ... CSS goes here ... } ``` * The CSS in that block will only apply when the browser window is less than 800 pixels wide. * Thread Starter [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/) * (@fabio-nunes-souza) * [9 years, 4 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8781434) * Thank Very Much! I’ll go try. * Thread Starter [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/) * (@fabio-nunes-souza) * [9 years, 3 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8850059) * HI! I got it! Thank very Much! * Now, please. Why Can not apen submenus in my mobile when my scrollbar is much to down? for example on [http://www.saborhonesto.com.br/menu](http://www.saborhonesto.com.br/menu) Could you help me resolve this? * Gratefully! * [Chad Chadbourne](https://wordpress.org/support/users/shireling/) * (@shireling) * [9 years, 3 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8854831) * [@fabio-nunes-souza](https://wordpress.org/support/users/fabio-nunes-souza/) – do you mean you want the menu button to stay on the screen when you scroll on mobile devices? * If so, try taking your current CSS: * ``` @media only screen and (max-width: 960px) { .menu-toggle { /* background-color: rgba(0,0,0,0.1); */ border: 1px solid rgba(255,255,255,0.2); display: block; font-family: "Lato", "Helvetica Neue", Helvetica, sans-serif; font-size: 1.4rem; font-weight: 700; letter-spacing: 0.1em; padding: 1em 1.5em; position: absolute; right: 0; text-transform: uppercase; top: -25px; width: 100%!important; } } ``` * Change **position** to `fixed` Change **top** to `0px` * That should put the menu at the top of the screen, and keep it there while you scroll down. * Let us know if that helps, or if you had something different in mind * Thread Starter [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/) * (@fabio-nunes-souza) * [9 years, 3 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8865727) * Hi Chad. Thank for your response, but like image attachment on mobile 1, when I click on menu, the sub menu appear like on mobile 2. On mobile 3 when the scroll is down (near the footer), I click on menu and the submenu does not appear like on mobile 4. to appear I need scroll up. Exist only this way? * Ask 2: On Desktop, why the principal menu does not following together with the scroll, like this site [http://www.condomanage.com.br?](http://www.condomanage.com.br?) * ![null](https://i0.wp.com/www.saborhonesto.com.br/wp-content/uploads/2017/03/ img.jpg) * Thank Very Much! - This reply was modified 9 years, 3 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). - This reply was modified 9 years, 3 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). - This reply was modified 9 years, 3 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). - This reply was modified 9 years, 3 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). * [Chad Chadbourne](https://wordpress.org/support/users/shireling/) * (@shireling) * [9 years, 3 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8871883) * Thanks for those screenshots, that helps a lot! * After calling in a little backup, I have some CSS that should help with the menu– we did notice that it looks like you might be modifying the theme’s stylesheet directly though. If you are, it would be much better to use the Additional CSS panel in the Customizer (if you haven’t already upgraded to WordPress 4.7, now is a good time!) * Editing the theme directly is risky, because if the theme gets updated, all of your changes will be lost. * Try this for the mobile menu: * ``` @media only screen and (max-width: 960px) { .primary-menu { background: #fff; bottom: 0; left: 0; right: 0; position: fixed; overflow: hidden; overflow-y: auto; top: 40px; } #site-navigation ul li { display: block; /* not table */ } #site-navigation ul a { padding: 1em } #site-navigation ul.sub-menu { background: #fff; padding-left: 2em; } } ``` * > On Desktop, why the principal menu does not following together with the scroll, > like this site [http://www.condomanage.com.br](http://www.condomanage.com.br)? * It looks like you’ve set your menu to scroll along with the page, but it doesn’t currently have any background to it. * Give this a try in your CSS: * ``` .site-header { position: fixed; } ``` * Let me know how it goes! * Thread Starter [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/) * (@fabio-nunes-souza) * [9 years, 3 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8887233) * Thank Very Much Chad! GREAT response about my first question! I got it! * About my secound question I thought that the principal menu goes along with the scroll bar in Dyad Theme default, or am I mistaken? * Gratefully - This reply was modified 9 years, 3 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). - This reply was modified 9 years, 3 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). * [Chad Chadbourne](https://wordpress.org/support/users/shireling/) * (@shireling) * [9 years, 3 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8890355) * You’re welcome! I had some help on that one, so I can’t take all the credit 😉 * By default, Dyad’s menu stays at the top ([demo site here](https://dyaddemo.wordpress.com/)) instead of scrolling along with you. * Thread Starter [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/) * (@fabio-nunes-souza) * [9 years, 2 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8921934) * Thank Very Much! - This reply was modified 9 years, 2 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). * [Chad Chadbourne](https://wordpress.org/support/users/shireling/) * (@shireling) * [9 years, 2 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-8922312) * My pleasure! * Thread Starter [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/) * (@fabio-nunes-souza) * [9 years, 2 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-9003183) * Hi! Please, On [https://aperitivedemo.wordpress.com/reservations/](https://aperitivedemo.wordpress.com/reservations/) I would like know if Is it possible Limit the number of reservations. Thank Very Much! - This reply was modified 9 years, 2 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). - This reply was modified 9 years, 2 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). * [Chad Chadbourne](https://wordpress.org/support/users/shireling/) * (@shireling) * [9 years, 2 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-9003267) * Hi Fabio – the reservations on that demo site use a Contact Form – the one being used on that site does not include a way to limit the number of submissions, but you may be able to find a plugin specifically designed for that purpose. * Try searching WordPress.org/plugins for “reservations” or “restaurant reservations” * Also, it will be best if you open a new thread for new questions – that way this one stays focused on the topic in the title 🙂 * Thread Starter [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/) * (@fabio-nunes-souza) * [9 years, 2 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-9003923) * Ok. Thank Very Much - This reply was modified 9 years, 2 months ago by [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/). Viewing 13 replies - 1 through 13 (of 13 total) The topic ‘Responsiveness customization’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/dyad/1.0.10/screenshot.png) * Dyad * [Support Threads](https://wordpress.org/support/theme/dyad/) * [Active Topics](https://wordpress.org/support/theme/dyad/active/) * [Unresolved Topics](https://wordpress.org/support/theme/dyad/unresolved/) * [Reviews](https://wordpress.org/support/theme/dyad/reviews/) ## Tags * [css](https://wordpress.org/support/topic-tag/css/) * [customization](https://wordpress.org/support/topic-tag/customization/) * 13 replies * 3 participants * Last reply from: [Fabio Nunes Souza](https://wordpress.org/support/users/fabio-nunes-souza/) * Last activity: [9 years, 2 months ago](https://wordpress.org/support/topic/responsiveness-customization/#post-9003923) * Status: resolved