CODEWITHSUNDEEP
htmlcssalignment
Hunter McMillen
Hunter McMillen

Reputation: 61550

Alignment of elements on a web page

I have a making a menu on a webpage and can't seem to get the elements to line up correctly. I have two buttons and two drop down menus, image attached below.

enter image description here

What sort of CSS styling can I do that will make the drop-down menus align horizontally with the 'Go' buttons? I tried adjusting the bottom and top margins of both elements but that doesn't seem to be what I am looking for.

Here is the current CSS for both elements:

select.small {   //<- drop downs
    width: 120px; 
    margin-bottom: 0px; 
}

button.small{  //<- buttons
    margin-bottom: 0px;
}

Any input would be appreciated as I am fairly new at this.

Upvotes: 0

Views: 207

Answers (3)

nakuldani
nakuldani

Reputation: 363

You can use table with no border and store these elements in table data. Also use padding style in it to make it look cozy.

Upvotes: 0

reisio
reisio

Reputation: 3242

You should try vertical-align: middle; first, but it depends on your HTML.

Upvotes: 0

PeeHaa
PeeHaa

Reputation: 72729

Set the position of the buttons to relative and add:

top: 5px;

or whatever is needed.

Upvotes: 1

Related Questions