JSFiddle - React, Tailwind, and code Playground

HTML

<p>
    Hello world. You look beautiful today.
</p>

CSS

p {
 border: 1px solid #000;
 padding: 20px;    
}

/* 
 * Here's my failed attempt at only altering the top 
 * and bottom padding values. The left and right padding
 * values are changing even if I use inherit.
 */

p {
 padding: 30px inherit;   
}