Archived topic
Troubles with Spacing
42 replies · Started by Sebastián on April 4, 2017
You're welcome :)
Hi! Everything on my website looks great right now except the mobile look of my site.
This is my blog page on mobile: http://i.imgur.com/hpG9X55.png
This is the single post page on mobile: http://i.imgur.com/KUjt9qe.png
I want to center everything for mobiles The title, the featured image, the images in general, the date and author and also the text. Is it possible? Only for mobiles the site on my computer looks amazing and i want to keep it that way.
Thanks
You mean like even out the padding on both side and make the container center?
Try this CSS:
@media (max-width: 768px) {
.separate-containers .inside-article {
padding: 30px;
}
}
I think it worked im seeing it different in my customize page but not in my mobile though.
Is it possible to center the title, date and author ONLY on mobile phones? Because the code you sended me leave the same space between both sides but not centered the elements.
And I say this every time I ask for something, just in case. Sorry if my english is bad, im really good at it but its not my native language.
thanks
Padding looks normal to me now. Try clearing mobile browser cache.
Try this additional CSS:
@media (max-width: 768px) {
.entry-header {
text-align: center;
}
}
Your English is very good :)
It didn't worked :/
I cleared my mobile cache and my blog page looks like this: http://i.imgur.com/FftpuRm.png
And I want something like this for example: http://i.imgur.com/FvlWKSZ.png
Looks like you didn't add the CSS here? https://generatepress.com/forums/topic/troubles-with-spacing/page/3/#post-339389
Oops typo. Missed a column. Try again. https://generatepress.com/forums/topic/troubles-with-spacing/page/3/#post-339389
Awesome! we're getting close to my wishes lol, its looking like this: http://i.imgur.com/ugIAxHw.png
Is it possible to reduce the padding between the image and the except text and also to center the read more tag? Something like this: http://i.imgur.com/njlOG0J.png Only on mobile
And i would like dissapear the sidebar from the mobile look. Only on mobile
Thanks!
Something like this:
@media (max-width: 768px) {
.post-image-aligned-left .post-image {
margin-bottom: 2px;
}
.read-more-container {
text-align: center;
}
.sidebar {
display: none;
}
}
Simply amazing. Thank you so much!
No problem!