Question

我的屏幕顶部有一个navbar左侧和右侧的元素，当我向左或向右调整窗口大小时，我希望元素一起推动直到它们点击，然后有窗口开始隐藏它。目前，一旦我的元素被击中，它会尝试获取navbar左侧的文本并将其堆叠在下面。我在右边的列表中使用了min-width并且工作正常，但右边文本的min-width只是在我的徽标和文本之间添加空格

很抱歉，如果这令人困惑。我对此有些陌生，所以只是试图解决问题。

CSS：

body {
background-color: #a9a9a9;
margin: 0px;
padding: -10px;
}
/*Navigation Bar*/
#imglogo{
width: 75px;
height: 65px;
float:left;
display: inline;
margin-left:50px;
margin-top: 0px;
}
#Logo{
    font-size: 28px;
    font-family: Montserrat;
    font-weight: 200;
    color: #FFFFFF;
    float:left;
    margin-left: 15px;
    margin-top: 15px;
}
#NavBackground {
    background-image: -webkit-linear-gradient(top, #696969 0%, #5C5C5C 100%);
    position: fixed;
    background-color:#696969;
    height:65px;
    width:100%;
    box-shadow: 0px 3px 4px #464646;
    margin: 0;
    text-align: right;
}
#NavBackground ul { 
    padding: 0 0 0 30px; 
    list-style: none;
    margin-top: 20px;
    margin-right: 15px;
    font-family:Montserrat;
    font-size: 16px;
    color: #D1D1D1;
    min-width: 1000px;
}
#NavBackground ul li { 
    margin: 0; 
    padding: 25px;
    display: inline; 
}

Div设置

<div id="NavBackground"> 
        <img id="imglogo" src="bklogo.png"></img>
        <text id ="Logo">BCd<span style="color:#D1D1D1">3d</span><span style="font-size:12pt">.com</span></text>    
        <ul id="Sections">
            <li id="Home"><u>Home&nbsp;&nbsp;</u></li>
            <li id="About Me"><u>About Me&nbsp;&nbsp;</u></li>
            <li id="Images"><u>Images&nbsp;&nbsp;</u></li>
            <li id="Videos"><u>Videos&nbsp;&nbsp;</u></li>
            <li id="Contact"><u>Contact&nbsp;&nbsp;</u></li>
        </ul>
    </div>

Answer 1

为#NavBackground添加最小宽度可能会起到作用

格式化最小化和重新调整浏览器大小时的问题

1 个答案: