Mobile version – header unaligned
-
On my android, everything looks perfect except for the header – it’s shifted to the left and has a white box next to it.
Let me know if this link doesn’t work: https://s3.amazonaws.com/pushbullet-uploads/ujuOYwE0qho-lR1DNq2N3BiNtmuBSayCt0fgaPLhmPk1/Screenshot_2015-01-12-16-27-35.png
ModThat’s not the mobile version, by the way. You’re just viewing the desktop theme on a mobile device.
You are seeing this problem because you have an extremely wide header image, and the header image has a left margin of -612.5px. So when your browser window becomes narrower than your header image, it gets pulled out of the location you see it when your browser window is wider than your header image.
You can see the same thing on desktop if you restore down your browser window and make it less than 1225 pixels wide.
Moved to Support. Please post in the correct section next time.
Sorry about that. Okay, so what do you suggest I do?
ModYou could use a separate stylesheet for various sizes of mobile devices, but to be honest the point of the css is to keep your header centered in the browser window. Try restoring down your browser window and change the width to see what I mean.
Good point. I *think* I fixed this, are you able to double check on your end? There is no need to make the width of the page and header smaller than 1225 pixels right?
ModThe blank space is gone, but your header is now off-center. It was better before.
Do you recommend I make the overall width of the banner and site smaller? Would this rectify the issue?
ModYes, and yes, mostly.
ModAlthough it is almost impossible to design a site that will look identical or even good on all devices.
Viewing 9 posts - 1 through 9 (of 9 total)
- You must be logged in to reply to this topic.