Archived topic
Left Margin of Left Column in Archives Not Aligned in Tablet
9 replies · Started by Suggie on March 1, 2018
Hi guys.
My archive and search results layouts all look great now (thanks for your help, Leo!), but I've noticed that in tablet only (using an old iPad mini) the two-column layout is getting pushed to the left by about 10-15px so it's cutting off some space. All other margins look fine. It's as if there's a negative left margin set somewhere that I can't find. Desktop and mobile look fine and are not having this issue.
You can see an example at: https://adventuresofthegassysquirrel.com/category/eat
Thanks!
Hi there,
Hmm can't seem to see the problem from browser resizing.
Can you provide a screenshots for what you are seeing? You can upload it to a site like this: https://postimages.org/
Hmm I can't get this to happen either.
Does it happen on every category page, or just that one?
It happens on all archive pages and search results. Thanks!
What browser on your iPad? Can you try a couple different ones?
I'm trying to get it to happen on my end, but I'm not having any luck.
Hmm....happening in both Chrome and Safari. Pages and posts on my site and other websites all look fine, so I don't think it's the tablet itself. So strange.
It's only the section where the actual posts are listed that is affected. If I scroll down below to the sidebar area, it's spaced properly.
Is there some CSS I can add in for left margin for tablet size? I'll try pushing it in 10 or 15px. I don't mind if this pushes other tablet views with a bit of extra spacing on the left (as long as it doesn't change the 2-column format).
Thanks!
You could try this:
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
.generate-columns-container {
margin-left: 10px;
}
}
If that media query doesn't work, you can find more here: http://stephen.io/mediaqueries/
Thanks, Tom! That works for me.
Awesome :)