Kevin Aartsen Kevin Aartsen - 1 year ago 59
CSS Question

Items in div not staying in position

I Created a menu div. In this div, I want to add a couple of list items and a logo on the left.
But, for example, when I give the menu items a padding or a height, they go outside the menu div like shown in the js fiddle. The items should not go outside their parent.

Answer Source

You should use floated element instead of margin you given to the menu element

#logo {
    height:50px;
    width:80px;
    background-color:red;
    float:left; // add this
}
#menu ul {
    // margin-left:70%; // remove this
    float:right; // add this
    position: relative;
    line-height: 100px;
}

https://jsfiddle.net/c6tp9zmx/1/