For some reason, single product titles are not displaying correctly on mobile phones with large screens when using WooCommerce + OceanWP – they go in the right, not lining up the way they should (under the product image). However, OceanWP shows the title positioned correctly when checking the single product page with its built-in mobile view.
This is a screenshot from Redmi Note 7 smartphone, 6.3 ” screen, using the latest Chrome:
I’m using some extra CSS to fix other things, could this be the problem?
h3.premium-banner-ib-title.premium_banner_title {
background-color: #ff9900;
text-align: center!important;
}
span.icon-magnifier {
font-size: 20px;
vertical-align: middle;
}
a.tinvwl_add_to_wishlist_button.tinvwl-icon-heart.tinvwl-position-after {
background: #ff9900;
padding: 2px 7px;
color: #fff;
}
.woocommerce ul.products li.product .price, .woocommerce ul.products li.product .price .amount {
color: #44c4ac;
font-family: rubik;
}
.woocommerce ul.products li.product .woo-entry-inner li {
margin-bottom: 0;
}
.woocommerce span.onsale {
display: none;
}
Other than that, it is a pretty standard OceanWP + WooCommerce setup.
]]>I have 2 questions:
1. How can I hide the grey ‘lines’ around for example my header, my logo, etcetera?
2. How can I hide the title (which now says ‘untitled’) on my front page? I tried to do this with several css codes, but until now it doesn’t work.
Hope you can help. Thank you!
Kind regards,
Esmee
]]>So I am having trouble getting these images to line up properly in pairs.
https://www.newfilmmakersla.com/about-us/newsletter/
Current html reads:
<div style=”float: left; margin-right: 10px; margin-bottom: 10px;”>
<img src=”https://www.newfilmmakersla.com/images/program/2014/July/SZIMAGES214DSCF6596.jpg” alt=”screenshot” width=”210″ height=”140″ border=”0″ />
<div>
<h1 style=”font-family: Arial, san-serif; font-weight: bold; font-size: 16px; color: #333333 !important; margin: 0 0 0 0;”>Fighter’s Room</h1>
<h2 style=”font-family: Arial, san-serif; font-weight: normal; font-style: italic; font-size: 12px; color: #3f748e !important; margin: 0 0 0 0;”>Shorts Program #1</h2>
<h3 style=”font-family: Arial, san-serif; font-weight: normal; font-size: 12px; color: #707070 !important; margin: 0 0 0 0;”>Director: Slav Zatova</h3>
</div>
</div>
<div style=”float: left; margin-right: 10px; margin-bottom: 10px;”>
<img src=”https://www.newfilmmakersla.com/images/program/2014/July/TPRK%20Still-%20Daniel%20Lilford.jpg” alt=”screenshot” width=”210″ height=”140″ border=”0″ />
<div>
<h1 style=”font-family: Arial, san-serif; font-weight: bold; font-size: 16px; color: #333333 !important; margin: 0 0 0 0;”>Two Penny Road Kill</h1>
<h2 style=”font-family: Arial, san-serif; font-weight: normal; font-style: italic; font-size: 12px; color: #3f748e !important; margin: 0 0 0 0;”>Shorts Program #1</h2>
<h3 style=”font-family: Arial, san-serif; font-weight: normal; font-size: 12px; color: #707070 !important; margin: 0 0 0 0;”>Director: Lisa Rose Snow</h3>
</div>
</div>
Thanks people!
]]>I would like to know how to line the images to the left side of the page, just below the titel of the post. And right now the images don′t fit into on page, they are being croped. All images are originally max. 700 width and max 600 height.
I’ve tried to figure it out myself, but I can’t resolve it. So if anyone have a clue please let me know, thanks!
Page:
wwww.gravityandgrace.se/wordpress
I have tried (very poorly) to add some transparent tables to my about page in an attempt to make things look a bit neater.
Although it seems to line up correctly in my version of IE, in firefox/chrome it appears the rows are not lining up correctly.
head over to https://designtavern.com/about and you’ll see what I mean..
Any help would be much appreciated.
Kind regards,
Henry.