http://www.kriesi.at/support/topic/need-help-finding-right-codecss-for-homepage-blocks-on-mobile-devices Support Forum - Topic: Need Help Finding Right Code/CSS for Homepage Blocks on Mobile Devices en-US Wed, 19 Jun 2013 22:05:09 +0000 http://bbpress.org/?v=1.0.2 q http://www.kriesi.at/support/search.php http://www.kriesi.at/support/topic/need-help-finding-right-codecss-for-homepage-blocks-on-mobile-devices#post-67105 Mon, 23 Jul 2012 06:12:44 +0000 Dude 67105@http://www.kriesi.at/support/ <p>Probably you won't be able to solve this issue with a static width value. Instead try something line:</p> <pre><code>#welcome { width: 25%; height: 160px; padding-left: 0px; padding-right: 0px; padding-top: 0px; padding-bottom: 0px; } @media only screen and (max-width: 767px) { #welcome { width: 50%; } }</code></pre> http://www.kriesi.at/support/topic/need-help-finding-right-codecss-for-homepage-blocks-on-mobile-devices#post-66365 Wed, 18 Jul 2012 13:45:08 +0000 RyanM6 66365@http://www.kriesi.at/support/ <p>Hi there, </p> <p>I had an issue earlier that I worked out by creating a specific div CSS for the four blocks of text on my homepage. I had four png buttons beneath those four blocks what would get misaligned in different browsers. </p> <p>The problem I'm having now is that when resizing the browser, because I defined the width of the div to be a specific width and height, the mobile and tablet version is keeping the dimensions. </p> <p>I've tried to add a class to the div and manipulate the @media command but have been unsuccessful at figuring it out after hours of struggling with it. </p> <p>Here is the code I created for the div: </p> <p>'<br /> #welcome {<br /> width: 205px;<br /> height: 160px;<br /> padding-left: 0px;<br /> padding-right: 0px;<br /> padding-top: 0px;<br /> padding-bottom: 0px;</p> <p>}</p> <p>'</p> <p>The png buttons are just a regular div in the html but they are wrapped in them. </p> <p>Whenever I set the width of the #welcome div to 99% it works on one hand by adjusting the with correctly but then my buttons have a large amount of white-space in between the text and the button itself when the browser is resized. </p> <p>If I set the height to 99% for the #welcome div, it recreates my original problem. The buttons beneath the blocks of text become misaligned. </p> <p>And I've tried multiple ways to . . . I've tried a lot of stuff and am hoping that I can get some direction/help. </p> <p><a href="http://underwearsociety.com">http://www.underwearsociety.com</a></p> <p>Thank you guys. </p>