<p dir="auto">In this link <a href="http://jsfiddle.net/tZXTv/" rel="nofollow">http://jsfiddle.net/tZXTv/</a></p>
<p dir="auto">1 - </p> has two classes: collapse navbar-collapse<p dir="auto"></p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/3471090/2567943/f731c114-b8db-11e3-8c66-0159154d6678.png"><img src="https://cloud.githubusercontent.com/assets/3471090/2567943/f731c114-b8db-11e3-8c66-0159154d6678.png" alt="1" style="max-width: 100%;"></a></p>
<p dir="auto">2 - </p> the class "collapse" has his position changed, and a class "in" is add<p dir="auto"></p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/3471090/2567985/70f0dbb6-b8dc-11e3-81b4-522bd9e1dc4a.png"><img src="https://cloud.githubusercontent.com/assets/3471090/2567985/70f0dbb6-b8dc-11e3-81b4-522bd9e1dc4a.png" alt="1" style="max-width: 100%;"></a></p>
<p dir="auto">3 - If resize the screem without click on this<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/3471090/2568020/f88a4148-b8dc-11e3-8b4f-f9f683b79f3d.png"><img src="https://cloud.githubusercontent.com/assets/3471090/2568020/f88a4148-b8dc-11e3-8b4f-f9f683b79f3d.png" alt="1" style="max-width: 100%;"></a></p>
<p dir="auto">this classes "navbar-collapse collapse in" aren't change</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/3471090/2568037/4d170f5c-b8dd-11e3-9940-cf185edefa2b.png"><img src="https://cloud.githubusercontent.com/assets/3471090/2568037/4d170f5c-b8dd-11e3-9940-cf185edefa2b.png" alt="1" style="max-width: 100%;"></a></p>
<p dir="auto">and why? because if i want to style the collapsed menu i need some class of reference, the only one is "in", and if this class is not removed i dont know what I  can use a reference to style.</p>
<p dir="auto">Currently this is duped a few times over: <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="21632511" data-permission-text="Title is private" data-url="https://github.com/twbs/bootstrap/issues/11243" data-hovercard-type="issue" data-hovercard-url="/twbs/bootstrap/issues/11243/hovercard" href="https://github.com/twbs/bootstrap/issues/11243">#11243</a>, <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="21882564" data-permission-text="Title is private" data-url="https://github.com/twbs/bootstrap/issues/11301" data-hovercard-type="issue" data-hovercard-url="/twbs/bootstrap/issues/11301/hovercard" href="https://github.com/twbs/bootstrap/issues/11301">#11301</a>, and <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="22230647" data-permission-text="Title is private" data-url="https://github.com/twbs/bootstrap/issues/11382" data-hovercard-type="issue" data-hovercard-url="/twbs/bootstrap/issues/11382/hovercard" href="https://github.com/twbs/bootstrap/issues/11382">#11382</a>—but the issue is described differently everywhere. This should clear things up and help us figure out what to do to fix it.</p>
<h4 dir="auto">Problem</h4>
<p dir="auto">Starting with a narrow viewport, one with the collapsed navbar contents, open the menu, then resize to full-width with all navbar contents visible. Shrinking the viewport back to the narrow size still shows the un-collapsed navbar contents.</p>
<p dir="auto">(Btw, this is currently visible in the docs.)</p>
<h4 dir="auto">Why this happens</h4>
<p dir="auto">We're using the collapse plugin to do this. Right now it has no idea about the dimensions of your viewport. All it does is toggle the appropriate classes based on clicks—click to open, click to hide.</p>
<p dir="auto">Our CSS utilizes those changes in classes from the plugin to style the menu accordingly. The CSS has no way to remove the <code class="notranslate">.in</code> class that the JS adds.</p>
<h4 dir="auto">Fix</h4>
<p dir="auto">We need the JS plugin to be updated to detect the viewport changes and remove the class. I don't know when or how this could happen, but that's the only solution. Will need to hear from <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/fat/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/fat">@fat</a> or anyone else with more JS-fu.</p>