Блог

Это мой код

 lt;div className='product'gt;  lt;img className='productImg' src={this.props.image} alt='of person'gt;lt;/imggt;  lt;div style={{float:'left'}}gt;{this.props.name}lt;/divgt;  lt;br /gt;  lt;div style={{float: 'left'}}gt;${this.props.price}lt;/divgt;  lt;br /gt;  lt;div style={{color: this.pickRatingColor(this.props.rating), float:'right'}}gt;{this.props.rating}/5lt;/divgt;    lt;/divgt;  

Это и есть результат

(Я просто использовал случайный снимок экрана, который у меня был для фотографии, так что не судите)

Дело в том, что я просто не могу понять, почему цена не опускается ниже названия, хотя я добавил перерыв. Я был бы признателен, если бы кто-нибудь объяснил, почему это происходит и как я могу это исправить. Спасибо!

Я не мог понять, почему вы используете float ; это будет исправлено, если вы удалите свои стили, добавленные в div имени и цены;