2015-08-21 4 views
0

привет, ребята, мне нужна помощь, я пытаюсь сделать полную ширину навигации, но ее внутри оболочки имени div, которая установила ширину 900 я не могу представить, как я могу это сделать, я не хочу для создания другого div, подобного заголовку, мне нужен способ, которым я могу установить всю ширину чего-либо внутри обертки, для меньшей кодировки здесь является HTML. P.S пожалуйста, код легко понять, что им просто новичок ..как сделать полную ширину, когда у вас есть контейнер

<html> 
    <head> 
     <title>MY TITLE</title> 
     <link rel="stylesheet" href="design.css"> 
    </head> 

    <body> 
     <div class="full"> 
      <div class="box"> 
       <h1>HEAD</h1> 
      </div> 
     </div> 
      <div class="wrapper"> 
      <div class="list"> 
       <ul> 
        <li>Home</li> 
        <li>About Us</li> 
        <li>Contact Us</li> 
       </ul> 
      </div> 
     </div> 
    </body> 
</html> 

, а вот CSS

*{ 
    padding:0px; 
    margin:0px; 

} 

.wrapper{ 
    margin:0 auto; 
    width:900px; 
    border:1px solid red; 
    background:green; 

} 
.full{ 
    width:100%; 
    background:black; 

} 
.box{ 
    text-align:center; 
    color:red; 
    width:500px; 
    margin:0px auto; 
    background:black; 

    } 
.list{ 
    margin:0 auto; 
    width:500px; 

    } 
ul li { 
    display:inline; 
    list-style-type:none; 
    padding-right:30px; 
    } 
+0

Как вы хотите, чтобы вещи внутри 'div' с классом' wrapper' были шире, чем '900px'? – Jay

+0

Сжатие чего-то большего, чем его контейнер, возможно, но это, конечно, не самая лучшая практика в этом случае. Вы знаете, что у вас могут быть две обертки, верно? Тот, который имеет полную ширину, которая содержит все, что должно быть 100% шириной, и внутри, что составляет всего 900 пикселей. – Neil

+0

Это не может превышать 900px, поскольку элемент находится под оберткой, которая равна 900px. он будет занимать 900 пикселей в качестве полной ширины, Вы можете позиционировать фиксированный верх 0., но он всегда будет придерживаться верхней части окна. и он будет на 100% окончен. – Vinayak

ответ

0

попробуйте использовать следующий CSS -

body { position: relative; } 
.list { height: 35px; left: 0; position: absolute; right: 0; top: 38px; width: 100%; } 
.list > ul { margin: 0 auto; max-width: 900px; padding: 7px 0; text-align: center; } 

Как вы хотите, чтобы держать вещи внутри обертки и без добавления какой-либо новый div, это кажется для меня решением.

0

попробовать это. попробуйте удалить width:900px;

или сделать его width: 100%;

.wrapper{ 
 
    margin:0 auto; 
 
    border:1px solid red; 
 
    background:green; 
 

 
}

+0

Это меняет предпосылки его вопроса, а не фиксирует его. – Neil

+0

Я хочу, чтобы только определенная часть в обертке была полной шириной, если бы я должен был сделать все внутри обертки, было бы 100% шириной –

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