Archived topic
Simple Mobile Responsiveness Request
5 replies · Started by Josep on August 14, 2018
I'm sure this is a simple fix that is just a touch above my skill level apparently.
My ad that I've placed on my website in GP hooks is displaying off center on mobile. How can I correct this so that it is centered on mobile as well.
Hi there,
Which element(s) are you referring to?
Let me know :)
I'm sorry about that - the giant miniture market ad at the top. "Life is good with games"
It looks great on desktop - it's pushed to the right by about 25-50 pixels on mobile.
Hmm replace your current HTML:
<div align="center">
<a href="http://bit.ly/2soUfDo"><img src="http://www.artofboardgaming.com/wp-content/uploads/2018/06/NEWjune.jpg" alt="" width="900" height="300" style="padding:20px"></a>
</div>
To this:
<div class="banner">
<a href="http://bit.ly/2soUfDo"><img src="http://www.artofboardgaming.com/wp-content/uploads/2018/06/NEWjune.jpg" alt="" width="900" height="300"></a>
</div>
Then add this CSS:
.banner {
text-align: center;
padding: 20px 0;
}
Adding CSS: https://docs.generatepress.com/article/adding-css/
Let me know if this helps :)
Perfect! It was displaying to the left on desktop when I made this change but I just added align="center" to the div tag and it fixed it. THANK YOU!!
No problem :)