2015-10-03 5 views
3

Я создаю свой собственный сайт для филиала, в котором я нахожусь, я наткнулся на проблему, которую я не могу решить.Объявление div не поместится в контейнере div

Я сделал этот код с HTML/CSS, и я хочу, чтобы мой рекламный div можно было разместить внутри моего контейнера div.

CSS:

#body { 
    font-family: verdana; 
    background-color: #4C4C4C; 
} 
#container { 
    background-color: #FFFFFF; 
    height: 900px; 
    width: 1250px; 
    margin-left: auto; 
    margin-right: auto; 
    margin-top: 15px; 
    position: relative; 
} 
#header { 
    background-image: url("company_banner.jpg"); 
    background-repeat: no-repeat; 
    background-position: right top; 
    vertical-align: middle; 
    width: 1250px; 
    height: 225px; 
    position: relative; 
} 
#streep { 
    background-color: #FC001E; 
    margin-top: 0px; 
    width: 1250px; 
    height: 1px; 
    position: relative; 
} 
#nav { 
    margin-top: 0px; 
    margin-left: 0px; 
    width: 180px; 
    height: 220px; 
    position: absolute; 
} 
#advertisement{ 
    background-image: url("advertisement.jpg"); 
    background-position: top; 
    width: 200px; 
    height: 180px; 
    margin-top: opx; 
    position: relative 
} 
#content { 
    margin-top: 0px; 
    margin-left: 225px; 
    width: 1025px; 
    height: 625px; 
    position: relative; 
} 
#footer { 
    background-color: #FC001E; 
    margin-bottom: 0px; 
    width: 1250px; 
    height: 50px; 
    position: relative; 
} 
h1 { 
    position: absolute; 
    top: 65px; 
    left: 25px; 
} 
ul#menu { 
    padding: 10px; 
    list-style-type: none; 
    margin-top: 0px; 
    border-radius: 4px 4px 4px 4px; 
} 
ul#menu li { 
    padding: 10px; 
} 
ul#menu li a { 
    background-color: black; 
    color: white; 
    padding: 10px 20px; 
    border-radius: : 4px 4px 4px 4px; 
    text-decoration: none; 
} 
ul#menu li a:hover { 
    background-color: #FC001E; 
} 

HTML:

<!DOCTYPE html> 
<html> 

<head> 
    <link rel="icon" href="favicon.ico" type="image/x-icon"> 
    <link rel="stylesheet" type="text/css" href="stylesheet.css"> 
    <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Nijhuis PC</title> 
</head> 

<body id=body> 
    <div id=container> 
    <div id=header> 
     <h1> 
     company name 
     </h1> 
    </div> 

    <div id=streep></div> 

    <div id=nav> 
     <ul id=menu> 
     <li><a href=index.html>Home</a> 
     </li> 
     <br> 
     <li><a href=services.html>services</a> 
     </li> 
     <br> 
     <li><a href=whoweare.html>who we are</a> 
     </li> 
     <br> 
     <li><a href=contact.html>Contact</a> 
     </li> 
     <br> 
     </ul> 
    </div> 

    <div id=content> 
     welcom to the company's main website 
     <br> 
     <br> 
    </div> 

    <div id=advertisement></div> 
    <div id=footer></div> 
    </div> 

</body> 
</html> 

Я хочу, чтобы мое объявление DIV под навигации дел.

Помогите мне, ребята?

+0

Я не вижу вашего объявления div. –

+0

О, дерьмо, извините, я удалил его. потому что это не сработало, но у моего объявления div есть следующие свойства: \t background-image: url ("advertising.jpg"); \t background-position: top; \t ширина: 200px; \t высота: 180px; \t margin-top: opx; \t позиция: относительная; – NPC

ответ

0

Один из вариантов заключается в том, чтобы поместить его в #nav после UL.

+0

Я пробовал это сейчас и, к несчастью, это не помогло, но спасибо вам за то, что подумал со мной. – NPC

+0

Можете ли вы рассказать мне, что происходит? Когда я запускаю код локально, он кажется помещенным как раз под навигационным меню. –

+0

Я только что узнал свою ошибку, я изменил порядок в таблице стилей CSS, но я не изменил порядок в HTML-коде:, D – NPC

 Смежные вопросы

  • Нет связанных вопросов^_^