Comment faire une taille div automatiquement, mais l'empêcher de se casser au bord de la fenêtre?

Question

J'ai un menu renversant CSS pur qui affiche un sous-nav sur le roulement. Je voudrais que la largeur de ce sous-nav soit ce qu'elle doit être pour que le contenu s'affiche (c'est-à-dire que je ne veux pas coder en dur une largeur dans le CSS). Cependant, si je ne code pas une largeur dans le CSS, la div se brise près du bord de la fenêtre et le contenu s'enroule. Si je définis une largeur, j'obtiens l'effet désiré (sauf que la div est une taille codée en dur) et le contenu ne s'enroule pas, il s'étend juste. Y a-t-il un moyen d'avoir les deux?

Answer 1

Vous voudrez peut-être regarder Superfish, en particulier avec l'option « Supersubs », http://users.tpg.com.au/j_birch/plugins/superfish/#sample5

Il ajuste automatiquement l'élément de subnav à la largeur du contenu.

Answer 2

Les DIV ne se cassent pas. Les listes non ordonnées se brisent. Le contenu à l'intérieur des listes est rompu, mais les divs sans largeur définie occupent toujours toute la largeur de la page (avant d'ajuster les marges).

Ce que vous voulez est de garder le contenu de la div d'emballage, ce qui peut être fait avec:

#navItem { 
    white-space: nowrap; 
} 

Il existe des moyens plus complexes d'avoir des largeurs dynamiques à l'aide et min- max-width, ou par en utilisant javascript, mais aucun n'est cohérent entre les navigateurs.