Hi there,
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.
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.
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.
Here is the code I created for the div:
'
#welcome {
width: 205px;
height: 160px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
padding-bottom: 0px;
}
'
The png buttons are just a regular div in the html but they are wrapped in them.
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.
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.
And I've tried multiple ways to . . . I've tried a lot of stuff and am hoping that I can get some direction/help.
http://www.underwearsociety.com
Thank you guys.
Create a new thread and tell me what problems you are encountering and what you want to know. 
There is no step 3 :) 
