HTML, CSS, Javascript | не могу поставить type=radio в
не могу выровнять в форме поиска радиокнопку , помогите плиз что за дичь не пойму . что только не делал (((
________
посл. ред. 11.04.2026 в 14:25; всего 1 раз(а); by pyrokinesis
php
<div class="search-bar">
echo'<form method="post" action="/blog/search.php?go" >';
$search=stripcslashes(htmlspecialchars($search));
echo'<input type="text" name="search" maxlength="64" value="'.$search.'" placeholder="Поиск без ограничений..." />';
echo " <div class='checkBox'>";
echo '<label>dddd<input type="radio" name="where" value="2"'.($where==2?' ':null).'></label>';
echo '<label>dddd<input type="radio" name="where" value="1"'.($where==1?' ':null).'></label>';
echo "</div>";
////echo'<input type="submit" value="Поиск" />';
echo'</form>';
echo "</div>"; css
.search-bar {
position: relative;
width: 300px;
}
.search-bar input {
width: 100%;
margin:0 !important;
padding: 10px 10px 10px 40px !important;
border: 1px solid var(--border-color) !important;
border-radius: 8px;
background: #fafafa;
font-size: 14px;
transition: var(--transition);
{
position:absolute;
top:0;
right:0;
background-color: green;
color: white;
border:solid 1px red;
display:inline;
}
} ________
посл. ред. 11.04.2026 в 14:25; всего 1 раз(а); by pyrokinesis
php
<div class="search-bar">
<form method="post" action="/blog/search.php?go">
<?php $search = htmlspecialchars(stripcslashes($search)); ?>
<input type="text" name="search" maxlength="64" value="<?php echo $search; ?>" placeholder="Поиск без ограничений...">
<div class="radio-group">
<label>
<input type="radio" name="where" value="2" <?php echo ($where == 2 ? 'checked' : ''); ?>>
<span>Вариант 1</span>
</label>
<label>
<input type="radio" name="where" value="1" <?php echo ($where == 1 ? 'checked' : ''); ?>>
<span>Вариант 2</span>
</label>
</div>
<button type="submit">Поиск</button>
</form>
</div> css
.search-bar {
width: 300px;
margin: 20px auto;
}
/* Поле ввода */
.search-bar input[type="text"] {
width: 100%;
box-sizing: border-box; /* Чтобы padding не раздувал ширину */
padding: 10px;
border: 1px solid #ccc;
border-radius: 8px;
margin-bottom: 10px;
}
/* Контейнер для радиокнопок */
.radio-group {
display: flex;
gap: 15px; /* Расстояние между кнопками */
align-items: center;
margin-bottom: 10px;
}
/* Выравнивание текста и кружочка внутри label */
.radio-group label {
display: flex;
align-items: center;
font-size: 14px;
cursor: pointer;
}
.radio-group input[type="radio"] {
margin-right: 5px; /* Отступ от кружка до текста */
cursor: pointer;
}
/* Кнопка отправки */
.search-bar button {
width: 100%;
padding: 10px;
background-color: green;
color: white;
border: none;
border-radius: 8px;
cursor: pointer;
} Лучший ответ
У этих кнопок есть косяк я сам с этим ставкивался не раз, для решения этой проблемы я использую допомнительный див или ботстрап.
Стр.: 1, 2