html设置选项的间距,如何使用CSS在这些选项之间设置间距?

我制作了一个关于蜘蛛饮料定价的React应用程序,我想在这些选项之间添加间距(如名称、价格、数量等,请参阅下面的图片以获得澄清)。

有办法吗?

谢谢您!

下面是add-component.css和add-component.jsx文件中的代码:

.style-up {

padding: 1.5rem;

}

import React from 'react'

import './add-ingredient.css'

const AddIngredient = () => {

return(

Name

type="text"

required

minLength="3"

id="ingredient-name"/>

Price

type="number"

min="0.01"

id="ingredient-price"/>

Quantity

type="number"

min="0.01"

id="ingredient-quantity"/>

Measure

Unit

Litres

Grams

Currency

$

£

RON

Add ingredient!

)

}

export default AddIngredient;