Pranav Kumar Pranav Kumar - 6 months ago 9
PHP Question

CSS - Two dropdown's joining error

The problem is in this image link right below:


As you can see, there are two arrows as there are two dropdowns. Can I give a space between them so they don't look that bad..?

The HTML Code is:

<label for="text3">Request for:</label>
<select name=category id=category class="text">
<option value='' selected>Select one</option>
<?Php require "config.php";// connection to database $sql="select * from category " ; // Query to collect data foreach ($dbo->query($sql) as $row) { echo "
<option value=$row[cat_id]>$row[category]</option>"; } ?>
<select name=sub-category id=sub-category class="text"></select>

The CSS Code is:

.text {
background: #333;
color: white;
width: 150px;
padding: 6px 15px 6px 35px;
transition: 500ms all ease;
border: 1px solid #333;
.text:hover {
box-shadow: 12px 13px 0px rgba(204, 211, 51, 0.38), -11px -14px 0px rgba(241, 96, 0, 0.28), 18px -24px 0px rgba(0, 0, 0, 0.34), 33px -6px 0px rgba(39, 74, 214, 0.28);


Try adding a margin to your text class, for example:

margin: 2px;