How to style Bootstrap dropdown-menu to be full page width?

First you shouldn’t wrap the navbar component in a div.container then update the css with the following Code:

.nav > li.dropdown.open {
    position: static;
}
.nav > li.dropdown.open .dropdown-menu {
    display:table; width: 100%; text-align: center; left:0; right:0;
}
.dropdown-menu>li {
    display: table-cell;
}

check the demo here http://www.bootply.com/8EgGsi4F7w