[SOLVED] montezuma not displaying properly on iphone
hello,
when i look at the montezuma theme on my iPhone, there is a ~20px margin on the right side of the entire content container. is there a way to get rid of that so that it displays full width on the phone? i found these two threads that have the similar problem Breadcrumbs - Not 100% width when loaded on iPhone [SOLVED] Front Page width on mobile but i couldn't figure it out. here's a screenshot, i colored it so i can see the edges of the boxes. http://monte.robotsheep.com/wp-conte...3/06/photo.png much thanks. |
What's the URL of your site?
I had the same problem on one of my Montezuma sites, but not the other. It was a 10px margin on the far right. It took me a while to figure out what the problem was (I couldn't figure it out right away using Firebug), but let me explain how I narrowed it down so I could eventually figure it out. Maybe it will help you figure out where your problem is. I started with index.php and copied all the code into my text editor for backup. Then I deleted out everything except for the get_header and get_footer calls (i.e., I deleted out all the post content), saved it, and took a look. I still had the problem. I then deleted out the get_header call, leaving just the footer, and the problem went away. I put the get_header call back in and removed the get_footer, and I saw the problem again. I put everything back in except the get_header call, and the problem went away. So I had narrowed the problem down to something in my header. In my header.php, I have four DIVs, one for the site title, one for a slider, one for the site description, and the last for the menu navigation (the call to wp_nav_menu). Each one of the DIVs has a class of col12, meaning they all span the entire width of the page. Similar to what I did with index.php, I cleared out all the DIVs except for one in header.php (make sure you copy the original somewhere), rotating between the four DIVs. In that mannner, I was able to narrow it down to my menu bar. After some trial & error, I finally was able to pinpoint the problem down to a margin definition that I had set in my menus_menu1.css file for #menu1-wrapper. So, as as I said earlier, your particular problem might be different. Perhaps it's a widget you have in your sidebar. But you should be able to isolate where the problem is by following the steps above. |
thanks for the tip. i'll try it and let you know.
i've been viewing a bunch of the showing off sites on the iphone and most of them have that right gutter problem. i guess people don't QA on smaller devices. thanks again for your insight. much appreciated. |
okay, you totally helped me out.
turning things off and on, i figured out breadcrumbs was too wide. in various.css i put in: Code:
@media only screen and (max-width: 767px) { |
All times are GMT -6. The time now is 07:00 PM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.