#html #css #bootstrap-5
Вопрос:
У меня есть одна кнопка с изображением внутри, и я хочу удалить заполнение, но, похоже, это не сработало. Я уже пытался удалить его с style="padding:0px !important"
p-0
помощью класса или использовать его. Кроме того, я изменил <button>
с <a>
, и это работает, но я потерял этот эффект клика.
Пожалуйста, какое-нибудь решение?
Моя навигационная панель HTML:
<nav class="d-flex icon_ah navbar sticky-top navbar-dark bg-dark navbar-expand-lg p-0">
<div>
<form action="#">
<button type="submit" class="navbar-toggler p-0 m-2 border-0">
<span class="bi bi-house-fill"></span>
</button>
</form>
</div>
<div>
<form class="btn-group">
<button class="navbar-toggler p-0 m-2 border-0" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false" data-bs-display="static">
<span class="bi bi-plus-circle"></span>
</button>
<ul class="dropdown-menu bg-dark d-lg-none" aria-labelledby="dropdownMenuButton1">
<?php for ($i = 0; $i < count($item_ah); $i ) { ?>
<li><a class="dropdown-item" href="<?= $item_ah[$i][1]; ?>"><?= $item_ah[$i][0]; ?></a></li>
<?php } ?>
</ul>
</form>
</div>
<div class="ms-auto">
<form class="btn-group">
<button class="navbar-toggler p-0 m-2 border-0" id="dropdownMenuButton2" data-bs-toggle="dropdown" aria-expanded="false" data-bs-display="static">
<img class="rounded" style="height:29.33px;" src="imgsystemuser.png" alt="user-glories">
</button>
</form>
</div>
<div class="collapse navbar-collapse" id="navbarNavDropdown">
<ul class="navbar-nav">
<li class="nav-item icon_ahm">
<a class="nav-link" href="<?= base_url('#'); ?>">
<b class="bi bi-house-fill"></b> Dashboard</a>
</li>
<li class="nav-item dropdown icon_ahm">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false">
<b class="bi bi-plus-circle-fill"></b> New
</a>
<ul class="dropdown-menu bg-dark" aria-labelledby="navbarDropdownMenuLink">
<?php for ($i = 0; $i < count($item_ah); $i ) { ?>
<li><a class="dropdown-item" href="<?= $item_ah[$i][1]; ?>"><?= $item_ah[$i][0]; ?></a></li>
<?php } ?>
</ul>
</li>
</ul>
</div>
</nav>
Мой CSS:
.sampul {
width: 70px;
}
.table > tbody > tr > * {
vertical-align: middle;
}
.icon_ah > div > button,
.icon_ah > div > form > button {
font-size: 29.33px;
}
.icon_ahm > ul > li > a,
.icon_ahm {
font-size: 13px;
}
.dropdown-item {
color: #b4b9be;
}
.dropdown-item:hover {
color: rgb(85, 85, 85);
background-color: rgba(255, 255, 255, 0.856);
}
.dropdown-item:active {
color: rgb(0, 0, 0);
background-color: rgba(255, 255, 255, 0.363);
}
Комментарии:
1. Вы пробовали установить что-то вроде
padding: 0 !important;
on .btn или кнопки в своей таблице стилей?2. можете ли вы проверить элемент и поделиться этим снимком экрана, чтобы иметь полное представление о том, в чем на самом деле проблема
3. Повторите проблему без php — кода-я не могу найти ваш заданный код.
4. @Loupeznik Да, я сделал, и это все еще не работает… Интересно, почему.
5. @JyotiAhluwalia Хм, хорошо, я попробую…
Ответ №1:
Вы пытались изменить размер коробки на содержимое коробки?