Фиксированный размер скважины в бутстрапе

77
9

У меня есть петля текста, отображаемая на странице, с кнопкой, которая циклирует цикл. Каждый раз, когда я нажимаю кнопку, ядро меняет размеры, так как текст отличается от длины, есть ли способ, которым я могу установить размер скважины, чтобы каждый клик оставался фиксированным, но в то же время все еще реагировал?

        <div class ="col-md-6">
<p id="quote">Delighted with my experience. Easy and comfortable. I have the utmost confidence in Scott and trust him to help me find the right vehicle for my self, family members and friends I have referred. I just purchased my 4th car from him. </p><button type="button" class="btn btn-success btn-lg" onclick = "cycle()">&gt</button>
</div>

function cycle() {
var randomNumber = Math.floor(Math.random() * (testimonials.length))
document.getElementById('quote').innerHTML = textimonals[randomNumber];
}
var testimonials = ["ex.", "ex.", "ex."]

спросил(а) 2020-04-04T01:38:36+03:00 3 месяца назад
1
Решение
68

Вы можете использовать min-height чтобы она оставалась на минимальной высоте и была отзывчивой.

function cycle() {
var randomNumber = Math.floor(Math.random() * (testimonials.length))
document.getElementById('quote').innerHTML = testimonials[randomNumber];
}

var testimonials = ["ex.", "ex.", "ex.", "Delighted with my experience. Easy and comfortable. I have the utmost confidence in Scott and trust him to help me find the right vehicle for my self, family members and friends I have referred. I just purchased my 4th car from him. Delighted with my experience. Easy and comfortable. I have the utmost confidence in Scott and trust him to help me find the right vehicle for my self, family members and friends I have referred. I just purchased my 4th car from him."];

#quote {
min-height: 50px;
}
<div class ="col-md-6">
<p id="quote">Delighted with my experience. Easy and comfortable. I have the utmost confidence in Scott and trust him to help me find the right vehicle for my self, family members and friends I have referred. I just purchased my 4th car from him. </p><button type="button" class="btn btn-success btn-lg" onclick = "cycle()">&gt</button>
</div>

ответил(а) 2020-04-04T01:52:45.295003+03:00 3 месяца назад
54

Конечно, просто установите разумную высоту, которая будет соответствовать всем рекомендациям.

#quote{
height: 300px;
}

ответил(а) 2020-04-04T01:38:36+03:00 3 месяца назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема