28106 sujets

CSS et mise en forme, CSS3

Bonjour,

Une partie de mon sous-menu dépasse de l'écran sur la droite. Est-ce qu'il existe une façon de l'obliger à rester dans la page ?

J'ai cherché une solution pour faire comme sur ce site avec le texte qui se justifie à gauche ou à droite selon la place du lien dans le menu mais sans succès.


<div id="global-navigation" class="sidebar-nav" role="navigation">
    <ul class="nav nav-tabs">
                        <li class="active"><a href="/"  ><img src="http://normandie-univ.halpreprod.archives-ouvertes.fr/public/accueil.png" alt="" width="20" height="20" /></a></li>
                            <li class=""><a href="/submit/index"  >Déposer</a></li>
                            <li class="dropdown ">
                    <a href="/section/repertoire" class="dropdown-toggle" data-toggle="dropdown">Explorer<b class="caret"></b></a>
                    <ul class="dropdown-menu">
                                                                                    <li><a href="/browse/last"  >Toutes les publications</a></li>
                                                                                                                <li><a href="/browse/doctype"  >Par type de publication</a></li>
                                                                                                                <li><a href="/browse/period"  >Par période</a></li>
                                                                                                                <li><a href="/browse/domain"  >Par domaine</a></li>
                                                                                                                <li><a href="/browse/author-structure"  >Par auteur</a></li>
                                                                                                                <li><a href="/browse/laboratory-structure"  >Par laboratoire</a></li>
                                                                                                                <li><a href="/page/par-collection"  >Par collection</a></li>
                                                                                                                <li><a href="/search/index"  >Rechercher</a></li>
                                                                        </ul>
                </li>
                                <li class="dropdown ">
                    <a href="/section/services" class="dropdown-toggle" data-toggle="dropdown">Utiliser<b class="caret"></b></a>
                    <ul class="dropdown-menu">
                                                                                    <li><a href="/page/formation-sur-inscription"  >Formation</a></li>
                                                                                                                <li class="dropdown-submenu">
                                    <a href="/section/tutoriels" class="disabled dropdown-toggle" data-toggle="dropdown">Tutoriels</a>
                                    <ul class="dropdown-menu">
                                                                                    <li><a href="/page/compte-et-profil"  >Compte et profil</a></li>
                                                                                    <li><a href="/page/quels-sont-vos-droits"  >Quels sont vos droits ?</a></li>
                                                                                    <li><a href="/page/deposer"  >Déposer</a></li>
                                                                                    <li><a href="/page/gerer-ses-depots"  >Gérer ses dépôts</a></li>
                                                                                    <li><a href="/page/idhal-et-cv"  >IdHAL et CV</a></li>
                                                                            </ul>
                                </li>
                                                                        </ul>
                </li>
                                <li class="dropdown ">
                    <a href="/section/valoriser" class="dropdown-toggle" data-toggle="dropdown">Valoriser<b class="caret"></b></a>
                    <ul class="dropdown-menu">
                                                                                    <li><a href="/page/creation-et-gestion-dune-collection"  >Gérer une collection</a></li>
                                                                                                                <li><a href="/page/a-propos"  >A propos</a></li>
                                                                        </ul>
                </li>
                                <li class="dropdown ">
                    <a href="/user/space" class="dropdown-toggle" data-toggle="dropdown">Mon espace<b class="caret"></b></a>
                    <ul class="dropdown-menu">
                                                                                    <li><a href="/user/submissions"  >Mes dépôts</a></li>
                                                                                                                <li><a href="/user/related"  >Lier mes ressources</a></li>
                                                                                                                <li><a href="/user/index"  >Mon profil</a></li>
                                                                                                                <li><a href="/user/docowner"  >Mes partages de propriétés</a></li>
                                                                                                                <li><a href="/user/filerequest"  >Mes partages de fichiers sous embargo</a></li>
                                                                                                                <li><a href="/user/ftp"  >Mes documents sur l'espace FTP</a></li>
                                                                                                                <li><a href="/user/search"  >Mes recherches</a></li>
                                                                                                                <li><a href="/user/library"  >Ma bibliothèque</a></li>
                                                                                                                <li><a href="/stat/user"  >Mes statistiques</a></li>
                                                                        </ul>
                </li>
                                <li class="dropdown ">
                    <a href="/rights/index" class="dropdown-toggle" data-toggle="dropdown">Privilèges<b class="caret"></b></a>
                    <ul class="dropdown-menu">
                                                                                    <li class="dropdown-submenu">
                                    <a href="/collection/index" class="disabled dropdown-toggle" data-toggle="dropdown">Collections</a>
                                    <ul class="dropdown-menu">
                                                                                    <li><a href="/user/collections"  >Mes collections</a></li>
                                                                                    <li><a href="/collection/list"  >Gestion des collections</a></li>
                                                                            </ul>
                                </li>
                                                                                                                <li><a href="/stat/index"  >Statistiques</a></li>
                                                                                                                <li class="dropdown-submenu">
                                    <a href="/website/index" class="disabled dropdown-toggle" data-toggle="dropdown">Site Web</a>
                                    <ul class="dropdown-menu">
                                                                                    <li><a href="/website/common"  >Général</a></li>
                                                                                    <li><a href="/website/style"  >Apparence</a></li>
                                                                                    <li><a href="/website/search"  >Recherche</a></li>
                                                                                    <li><a href="/website/header"  >En-tête</a></li>
                                                                                    <li><a href="/website/footer"  >Pied de page</a></li>
                                                                                    <li><a href="/website/menu"  >Menu</a></li>
                                                                                    <li><a href="/website/news"  >Actualités</a></li>
                                                                                    <li><a href="/website/public"  >Ressources</a></li>
                                                                            </ul>
                                </li>
                                                                                                                <li class="dropdown-submenu">
                                    <a href="/administrate/index" class="disabled dropdown-toggle" data-toggle="dropdown">Administrer</a>
                                    <ul class="dropdown-menu">
                                                                                    <li><a href="/administrate/pending-modification"  >Documents en attente de modifications</a></li>
                                                                                    <li><a href="/moderate/embargo"  >Documents en accès restreint</a></li>
                                                                                    <li><a href="/settings/metadata"  >Métadonnées</a></li>
                                                                                    <li><a href="/administrate/users"  >Utilisateurs</a></li>
                                                                                    <li><a href="/administrate/doublons"  >Gestion des doublons</a></li>
                                                                            </ul>
                                </li>
                                                                        </ul>
                </li>
                    </ul>
</div> 




.nav-tabs {
padding-top: 5.5%;
border-bottom: none;
}

.nav-tabs a{
font-family: "Century Gothic", "Avant Garde", Avenir, TeXGyreAdventorRegular, Verdana, sans-serif;
color: #004c99;
text-transform: uppercase;
font-weight: 500;
font-size: 1.2em;
min-width: 10%;
}

.nav-tabs > li > a:hover {
background-color: transparent;
border-left: 3px solid #004c99;
border-top: 1px solid #eceded;
border-right: 1px solid #eceded;
border-bottom: 1px solid #eceded;
border-radius: 0;
}

.dropdown-menu{
border-left: 3px solid #004c99;
border-top: 1px solid #eceded;
border-right: 1px solid #eceded;
padding-left: 10px;
padding-right: 10px;
border-top: 1px solid #eceded;
border-radius: 0;
box-shadow: none;
}


.dropdown-menu > li > a {
font-size: 1em;
color: #004c99;
background-color: white;
padding-top: 8px;
padding-bottom: 8px;
border-bottom: 0.5px solid #eceded;
border-top: none;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
color: #006eab;
background-color: white;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover {
color: #006eab;
border: none;
}