Граница боковой панели не отображается - PullRequest
Новая
       0

Граница боковой панели не отображается

0 голосов
/ 20 января 2012

Я пишу код веб-сайта, но не могу отобразить границы для боковой панели. Здесь это так.И ниже код, 

<!DOCTYPE html >
<!--HTML WEBSITE
/*********************************************************************************************************************************************************NAME:FAHAD UDDIN*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************
-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>The New Boston</title>
<style type="text/css">
#container
{
    padding:0px;
    margin:0px;
    background:#BFBFBF;
}
#header
{
    height:100px;
    background-color:#333;

}
#header logo
{

}
#navigation
{
    padding:0px;
    margin:0px; 
}
#navigation ul
{
        background-color:#F00;
}
#navigation ul li
{
    text-decoration:none;
    display:inline;
    color:white;
    font-size:16px;
    padding-right:40px;
    padding-top: 0px;
}
#sidebar
{
    display: inline;
    margin-left: 20px;
    width: 300px;
    height:800px;
    border-bottom-color:#666;
    border:thin;
    background-color: white;
    background-repeat:repeat;
}
#content
{
    float:left;
    height: 800px;
    width: 800px;
    background-color:#FFF;
    display:inline;

}
#footer
{
    clear:both;
    height:200px;
    background-color:#333;
}
</style>

</head>

<body>
    <div id="container">
            <div id="header">
            </div>
            <div id="navigation">
                <ul>
                    <li><a href="#"><a/>Home</li>
                    <li><a href="#"><a/>Home</li>
                    <li><a href="#"><a/>Home</li>
                    <li><a href="#"><a/>Home</li>
                    <li><a href="#"><a/>Home</li>

                </ul>
            </div><!--Header Ends-->
        <div id="content">
        <p>This is the complain area. Fill complains here</p>
        </div><!--Content ENDS-->
        <div id="sidebar">
        <p>This is a website.</p>
        </div><!--SIDEBAR ENDS-->
        <div id="footer">
        </div><!--FOOTER ENDS-->
    </div><!--CONTAINER ENds-->
</body>
</html>

1 Ответ

2 голосов
/ 20 января 2012

1) В вашем html есть ошибка - вы дали / вместо / a: 

<li><a href="#"><a/>Home</li>

2) float для спасения: передайте это свойство в: 

<p style="float: left">This is a website.</p>

и добавить число с плавающей точкой: право на # sidbar

3) Что такое граница: тонкая в #sidebar?Дайте границу: 1px solid.Прочтите это для разрешенных атрибутов и их значений: http://www.w3schools.com/css/css_border.asp

ОБНОВЛЕНИЕ

Проверьте здесь: http://jsfiddle.net/FPJTn/1/ Боковая панель перешла на следующую строку из-зазначение, указанное для ширины содержимого.Я изменил #content css с ширины: 800 пикселей на ширину: авто.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...