Html CSS-我的UL卡在标题中_Html_Css

Html CSS-我的UL卡在标题中

html css

Html CSS-我的UL卡在标题中,html,css,Html,Css,我试图建立的网站是一个旧的BBC布局的副本。我试图让“新闻”标签向左移动，但它不会移动。我不知道是什么问题。我试过改变边距和填充。这似乎不起作用。我还试着在某些部分将位置改为相对位置，然后向左移动：-50。文本就是不动代码段中的图像和“登录”文本不会加载，因为它们在我的计算机上。所以忽略左边的空白身体{ 保证金：0； } #顶栏{ 背景色：#700001；宽度：100%；高度：44px；颜色：白色；字体大小：粗体；字体系列：Ariel，Helvetica，无衬线；字号：1em

我试图建立的网站是一个旧的BBC布局的副本。我试图让“新闻”标签向左移动，但它不会移动。我不知道是什么问题。我试过改变边距和填充。这似乎不起作用。我还试着在某些部分将位置改为相对位置，然后向左移动：-50。文本就是不动

代码段中的图像和“登录”文本不会加载，因为它们在我的计算机上。所以忽略左边的空白


身体{
保证金：0；
}
#顶栏{
背景色：#700001；
宽度：100%；
高度：44px；
颜色：白色；
字体大小：粗体；
字体系列：Ariel，Helvetica，无衬线；
字号：1em；
}
.固定宽度{
宽度：1050px；
保证金：0自动；
}
#logodiv{
填充：3px 8px 0px 0px；
位置：相对位置；
左：-150px；
浮动：左；
右边框：1px#9f003实心；
}
#signindiv{
位置：相对位置；
左：-145px；
浮动：左；
填充：2px 80px 13px 5px；
右边框：1px#9f003实心；
}
#符号img{
位置：相对位置；
顶部：5px；
}
#托普梅努迪夫{
浮动：左；
}
#托普梅努迪夫{
保证金：13px 5px 13px 5px；
浮动：左；
}
#托普梅努迪夫李{
列表样式：无；
}


假BBC
登录

新闻

那是因为你错过了一次结账

 </div>

你的压痕很糟糕

<body>
    <div id="container">
        <div id="topbar">
            <div class="fixedwidth">
                <div id="logodiv">
                    <img src="images/bbclogo.png" />
                </div>
                <div id="signindiv">
                    <img src="images/signinlogo.png" /> Sign In
                </div>
            </div>
            <div id="topmenudiv">
                <ul>
                    <li>News</li>
                </ul>
            </div>
        </div>
    </div>
</body>


登录

新闻

或


登录

新闻

我不知道你在哪里错过了。尽管我很确定这是第一个。

试试这个，这里是

用这个更新你的css

    body{
        margin:0;
    }

    #topbar{
        background-color:#700001;
        width:100%;
        height:44px;
        color:white;
        font-weight:bold;
        font-family:Ariel, Helvetica, sans serif;
        font-size:1em;
    }

    .fixedwidth{
        width:1050px;
        margin:0 auto;
    }

    #logodiv{
        padding:3px 8px 0px 0px;
        position:relative;
        float:left;
        border-right:1px #9F0003 solid;
    }

    #signindiv{
        position:relative;
        float:left;
        padding:8px 10px;
        border-right:1px #9F0003 solid;
    }

    #signindiv img{
        position:relative;
    }

    #topmenudiv{
        float:left;
    }

    #topmenudiv ul{
        margin:8px 10px;
        float:left;
        padding-left: 5px;
    }

    #topmenudiv li{
        list-style:none;
    }

好吧，那不呢？这个问题不在他的CSS上，问题是他丢失了一个结束Div，代码工作时没有弄乱CSS。是的，我还在我的

HTML

中修复了这个结束Div，是的，问题在CSS中。

    body{
        margin:0;
    }

    #topbar{
        background-color:#700001;
        width:100%;
        height:44px;
        color:white;
        font-weight:bold;
        font-family:Ariel, Helvetica, sans serif;
        font-size:1em;
    }

    .fixedwidth{
        width:1050px;
        margin:0 auto;
    }

    #logodiv{
        padding:3px 8px 0px 0px;
        position:relative;
        float:left;
        border-right:1px #9F0003 solid;
    }

    #signindiv{
        position:relative;
        float:left;
        padding:8px 10px;
        border-right:1px #9F0003 solid;
    }

    #signindiv img{
        position:relative;
    }

    #topmenudiv{
        float:left;
    }

    #topmenudiv ul{
        margin:8px 10px;
        float:left;
        padding-left: 5px;
    }

    #topmenudiv li{
        list-style:none;
    }