vignaliizada88

Здравствуйте, не подскажите как растянуть выпадающее меню на всю ширину страницы, что бы контент/ссылки так и оставались на середине? Догадываюсь, что проблема в позиционировании "absolute" "relative", но знаний не хватает куда что прописать. Вот код css: #menu-wrapper {display:block; width:960px; margin: 0 auto;} /* Reset */ .nav, .nav a, .nav ul, .nav li, .nav div, .nav form, .nav input { margin: 0; padding: 0; border: none; outline: none; } .nav a { text-decoration: none; } .nav li { list-style: none; } /* Menu Container */ .nav { display: inline-block; position: relative; cursor: default; z-index: 500; width: 100%; height: 95px; } /* Menu List */ .nav > li { display: block; float: right; } /* Menu Links */ .nav > li > a { position: relative; display: block; z-index: 510; height: 100px; padding: 0px 20px 0px 20px; line-height: 100px; text-transform: uppercase; font-family: Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 600; color: #23ADC7; text-decoration: none; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; } .nav > li:hover > a { color: #FFD200; text-shadow: -1px 1px 6px #FFBD10, 1px -1px 6px #FFBD10; text-decoration: none; background: #6808C4; } .nav > li:first-child > a { border-left: none; text-decoration: none; } .nav > li.srt { display: block; float: left; } .nav > li.srt > a { position: relative; z-index: 510; text-transform: uppercase; font-family: Arial, Helvetica, sans-serif; font-size: 30px; font-weight: 700; color: #23ADC7; text-decoration: none; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; } .nav > li.srt:hover > a { color: #FFD200; text-shadow: -1px 1px 6px #FFBD10, 1px -1px 6px #FFBD10; text-decoration: none; background: #6808C4; } /* Menu Dropdown */ .nav > li > div { position: absolute; display: block; width: 100%; top: 100px; left: 0; opacity: 0; visibility: hidden; overflow: hidden; background: #6808C4; -webkit-transition: all .3s ease .15s; -moz-transition: all .3s ease .15s; -o-transition: all .3s ease .15s; -ms-transition: all .3s ease .15s; transition: all .3s ease .15s; } .nav > li:hover > div { opacity: 1; visibility: visible; overflow: visible; }