Yay! THANK YOU! It looks so much better now! I have one last question if you dont mind. In the Top Bar, is it possible to space out the categories a bit?
Hi There @leahvachani
Try adding the following CSS rule as well into your X -> Theme Options -> CSS area.
.x-topbar .p-info a {
margin-right: 5px;
margin-left: 5px;
}
Hope that helps.
Thanks again, you guys are amazing.
I just went to my site on my mobile and after changing this code my “Shop” pages are different now. The images are not responsive to mobile (they are very large) and the padding/margins seem off as well.
The page that is the worst is: https://lunchwithleah.com/shop-2/my-lunchboxes/ (it looks find on desktop but not okay on mobile)
Also on the (https://lunchwithleah.com/shop-2/) main shop page the paddings/margins are different now between the images.
I have not changed anything so I have no idea what to do, something with this Top Bar code css is affecting it.
Hello There,
This is how we see the pages in smaller screens:
We also noticed that you are using Jetpack plugin and Photo module is active. It seems that the images being displayed is a cached version. Please deactivate Photon module and see how it goes. To know more about the Pros and Cons of using Photon module, you can check it here: https://developer.wordpress.com/docs/photon/
Hope this helps.
I deactivated Photon and that seems to have fixed the problem.
Once again, thank you so much for all the great help!
You are most welcome. 
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.