First of all, bootstrap makes you really unflexible. So if you want to use it I suggest to move the submenu out of the menu's elements, because the
width:100%; is dependent on the parent. So everything that should be wider than the parent, shouldn't be the child of this parent element. In addition
position:absolute is dependent on the next parent with
position:relative. So there are many things that don't make it easy. To move the submenu would make it a lot easier. There you can just use
Alternatively to get the submenu out of the flow of the page, you could use
width:100%. Check out the Codepen for this solution. I like the first one more, even if it's more work. However, fixed positioning has some side effects, but maybe it's not important for you.