In the SiteOrigin CSS editor, I highlight an element named .wpdiscuz-post-rating-wrap.wpd-custom-field. A rectangular box is displayed in blue. Let’s say the height measures 3 inches.
These are the .wpd-custom-field declarations displayed in the editor:
display: table
border: 0
The element inside .wpd-custom-field is named .wpd-rating. If I highlight wpd-rating, now I see the same size rectangle, except there is a narrow aqua bar across the top and across the bottom. The center area for the .wpd-rating element is still blue.
These are the .wpd-rating declarations displayed in the editor:
display: flex
border: 0
Let’s say the top and bottom aqua bars measure 1/2 inch each and the blue center measures 2 inches (1/2+1/2+2=3 inches).
I want to eliminate this unnecessary 1/2 inch space above and below the data.
Using the CSS Editor, how can I decrease the height of the .wpd-custom-field element so it is the same height as the .wpd-rating element (2 inches)?
Here’s a link to the webpage: https://virtualrdn.com/banana-chocolate-chip-buckwheat-pancakes/
Hi VirtualRDN
Thanks for reaching out.
Our free support scope covers basic usage and troubleshooting. We’re able to dive quite deep into issues like this within our premium support scope where we have the budget to do so. In this case, it’s a bit challenging to assist without completing the Custom CSS task. At a glance
wpd-custom-fieldandwpd-ratingare both 115px high. Part of the height ofwpd-ratingis a top and bottom margin. You can perhaps try setting the top and bottom margin of that div to zero and then increase the static height you’ve already assigned.