如何在将徽标留在原处的同时拉伸导航栏？

Question

我希望导航栏上的蓝色显示为顶部，因此它覆盖了灰色但不是覆盖边框，我还希望徽标保留在原位。 < / p>

代码就在这里。 http://pastebin.com/YDM1PFMe

Answer 1

您需要将margin-top更改为padding-top，否则边距只会将内容降低50px。

.sideimage {
    text-align: center;
    padding-top: 50px;
}

这是一个JS小提琴https://jsfiddle.net/0w742c4f/1/

Answer 2

删除边距：

.sideimage {
    text-align: center;
    //margin-top: 50px;
}

请参阅小提琴：https://jsfiddle.net/DIRTY_SMITH/7oe5kh9L/35/

我认为您希望的效果是使用padding-top代替：

.sideimage {
    text-align: center;
    padding-top: 50px;
}

请参阅小提琴：https://jsfiddle.net/DIRTY_SMITH/7oe5kh9L/36/