Getting 2 divs on the same line

Answer 1

Add float : left; attribute to the div.menu

Answer 2

line-height(child-elements) with a combination of the previous answers

Answer 3

You can play with float:

float: left;
float: right;
clear: both;

This is not always easy to do.

Another option is to use

display: inline-block;

or to use a span.

Answer 4

#NavigationMenu {
    float: left;
}

.SearchBox {
    float: right;
}

.MenuDiv {
    overflow: hidden; /* adjusts the height of .MenuDiv to wrap its children */
}

Answer 5

Set

display: inline-block;

And then set their widths as you need (as an absolute value or percentages of the parent container)

Live Demo