http://www.kriesi.at/support/topic/propulsion-main-menu-social-media-icons-divider-flag Support Forum - Topic: Propulsion Main menu, Social Media icons, divider flag en-US Fri, 24 May 2013 03:20:59 +0000 http://bbpress.org/?v=1.0.2 q http://www.kriesi.at/support/search.php http://www.kriesi.at/support/topic/propulsion-main-menu-social-media-icons-divider-flag#post-82300 Mon, 05 Nov 2012 14:43:28 +0000 Devin 82300@http://www.kriesi.at/support/ <p>Hi Pixelist,</p> <p>It looks like the menu is properly scaling to the browser width now. </p> <p>For the images, they will scale if the container they are inside scales down. Right now, they just wrap to the next line and nothing is forcing them smaller.</p> <p>So you could add a new container div to them and then use media queries to shrink them based on the users screen size or just have them removed for mobile since shrinking them would make it pretty hard to read. IE, something like this:<br /> <pre><code>/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) { #top .header-ads{display:none; } }</code></pre> <p>where header-ads is the new div class you'll wrap the images inside.</p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/propulsion-main-menu-social-media-icons-divider-flag#post-82127 Sat, 03 Nov 2012 20:10:42 +0000 pixelist 82127@http://www.kriesi.at/support/ <p>Hi Ismael</p> <p>Thanks for your reply</p> <p>The strip i was referring to was the rounded block of colour behind the menu, I've managed to get it to extend to the full width of the site. Only thing is It doesn't reduce on tablet 800 x 600 size so it extends past the right hand side of the site. How can i target this in the css?</p> <p>Also what makes the images reduce? ie the images to the right of the logo don't currently reduce That's fine for tablets but they remain the same size on mobile - can I set their size with css3 somewhere?</p> <p>regards</p> <p>Pixelist </p> http://www.kriesi.at/support/topic/propulsion-main-menu-social-media-icons-divider-flag#post-82057 Sat, 03 Nov 2012 03:01:12 +0000 Ismael 82057@http://www.kriesi.at/support/ <p>Hi pixelist,</p> <p>This code on your Quick CSS is responsible for the background color of your menu:<br /> <pre><code>.main_menu { top: 20px; background: red; height: 20px; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f50019), to(#a10013)); background-image: -webkit-linear-gradient(top, #f50019, #a10013); background-image: -moz-linear-gradient(top, #f50019, #a10013); background-image: -ms-linear-gradient(top, #f50019, #a10013); background-image: -o-linear-gradient(top, #f50019, #a10013); background-image: linear-gradient(top, #f50019, #a10013); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 2px 5px 0px 5px rgba(0, 0, 0, 0.2); -moz-box-shadow: 2px 5px 0px 5px rgba(0, 0, 0, 0.2); box-shadow: 2px 0px 5px 5px rgba(0, 0, 0, 0.2); }</code></pre> <p>I'm also not sure what you mean by strip? The propulsion theme by default doesn't have any background at all on its menu.</p> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/propulsion-main-menu-social-media-icons-divider-flag#post-81948 Fri, 02 Nov 2012 12:00:52 +0000 pixelist 81948@http://www.kriesi.at/support/ <p>Thanks Ismael</p> <p>It has worked, but it's turned the dropdown menu background to red as well - is it possible to to leave this as it was (default colour) and just the strip behind the menu in red?</p> <p>Also how do I get the strip to extend to the right edge of the site?</p> <p><a href="http://aclgroup.co.uk/wordpress/" rel="nofollow">http://aclgroup.co.uk/wordpress/</a></p> <p>regards</p> <p>Pixelist </p> http://www.kriesi.at/support/topic/propulsion-main-menu-social-media-icons-divider-flag#post-81885 Fri, 02 Nov 2012 00:58:43 +0000 Ismael 81885@http://www.kriesi.at/support/ <p>Hi,</p> <p>You can do the following</p> <p>1.) To create a background color on the menus you can add this code on your custom.css</p> <pre><code>#menu-main-menu li { background: red; }</code></pre> <p>2.) If you want to take out transparency of the social icons, you need to edit the icons directly which are located on propulsion/images/layout folder.</p> <p>3.) To change the diamond on the flag, just make the color same with the background color</p> <pre><code>.flag-diamond.site-background { background: red!important; }</code></pre> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/propulsion-main-menu-social-media-icons-divider-flag#post-81847 Thu, 01 Nov 2012 18:52:44 +0000 pixelist 81847@http://www.kriesi.at/support/ <p>Hi<br /> Firstly I want to just thank you guys for responding to my previous questions - your support is better than BT's they could learn a thing or two from your company. I hopefully, only have a few more questions. </p> <p>Is there a way to:-</p> <p>1. Put a single or seperate block or band of colour behind the main menu items.</p> <p>2. Take the transparency off the social media buttons.</p> <p>3. Change the colour of the white block that sits to the right behind the flag divider rule (so it doesn't show up if I change the content background colour).</p> <p>regards</p> <p>Pixelist </p>