CSS, line-height, IE & Chrome... Argggh !

Bonjour à tous,
Je m'en viens encore une fois quémander l'aide de la communauté qui m'a déjà tiré d'affaire lors de précédentes aventures liées à ce monde dans lequel je ne pénètre qu'à reculons, j'ai nommé le CODE !!!
Encore une fois, je ne suis pas sûr de poster au bon endroit... Modérateurs et Alsanautes, ne me conspuez pas, pitié ! Merci de bien vouloir simplement me rediriger si ce sujet était déjà traité (ce que j'ai essayé de trouver avant de poster)...

Bref, pour en revenir à nos moutons, voici mon problème :
Tout d'abord, notez bien que je ne suis pas l' dév qui a codé le site... Je ne suis qu'un modeste front-end webdesigner et d'habitude, je ne gère pas ce genre de choses...

Il s'agit en fait de contraindre un texte à rester contenu dans une <div> à une hauteur spécifiée. Ma "div" (contenue dans une <div> contenue dans une <li> contenu dans un accordéon Jquery) ne réagit pas au "height:xxx px" et le texte disparait au delà de la <div> parente...
La seule solution (qui je le sais n'en est pas une, mais qui fait que cela fonctionne) que j'ai pu trouver est de placer l'attribut (aie! suis pas sûr de l'appellation) "line-height:0px," sur le texte contenu dans cette div afin d'obtenir le résultat souhaité sous Chrome. Le problème, c'est le passage à IE (tiens donc...). Mais paradoxalement, c'est parce que ça fonctionne correctement ! Donc mes lignes de texte se chevauchent, ce qui n'est pas le cas sous Chrome.

Donc maintenant la question : est-il possible en CSS de créer une classe et de ne la faire appliquer qu'en cas de détection d'un navigateur ? (dans mon cas, Chrome, sinon, la classe ne doit pas être appliquée).
Le site a été créé sous Wordpress, il utilise CSS, PHP et javascript... Donc pas de restriction de ce côté là, tout semble bon à prendre !

Mais si vous avez une autre solution à me proposer que cette histoire de détection de navigateur et application d'une classe, je suis bien sûr preneur !
Mais avant ça faut-il que j'aie réussi à me fiare comprendre...

Merci d'avance,
De vous lire très bientôt !!!

Olivier

Bonjour, te comprendre oui, mais sans ton code ou mieux, une page en ligne, on ne pourra pas t'aider

Arf... Impossible de donner un lien vers la page dans l'immédiat, mon client n'apprécierait pas du tout !!!

Et cela revient pratiquement au même de copier/coller le code ici...

Je vais tenter de le réécrire en substance en virant toutes les références.

Merci en tout cas !

Hummmm...
Désolé Laurie Anne, je pensais pouvoir supprimer celui-ci, en fait
Modifié par CreaphicD (19 Jul 2011 - 13:05)

Même chose que pour le précédent, ne pas prêter attention...
Modifié par CreaphicD (19 Jul 2011 - 13:07)

Ben du coup, ce bout de code semble décourager tout le monde...

Et tu t'en étonne ?

Merci d'utiliser les balises de mise en forme du code (colorisation syntaxique, juste en dessous des smileys).

Merci pour le conseil avec les balises...
Je ne me suis donc pas trompé en postant dans la section "débutants"



Bon ben voilà...

Si ça peut aider pour m'aider...
Encore plein de réglages à faire !!!
Et attention, ça risque de faire mal aux yeux de certains...

Donc, voici ce qu'il y a dans mon accordéon Jquery :

<?php
get_header(); ?>

<?php get_sidebar(); ?>

<div id="container">
<div id="content" role="main">

<div id="home">
<div class="entry-content">
<div id="menu">

<ul id="sm" class="sm">

<li><div id="pt_cinema">

<div id="pt_cinema_links" height="150px">

<a href="http://www.voi/cinema/" class="c_000 s_2 c_ch">&#21127;&#24773;&#31777;&#20171;</a>
<a href="http://www.voi/cinema-fr/" class="c_fff s_2 f_fr">BOX-OFFICE</a>
<a href="http://www.voi/cinema-fr/" class="c_999 s_2 f_fr">DISTRIBUTEURS</a>
<a href="http://www.voi/cinema/" class="c_000 s_4 c_ch">&#24433;&#23637;</a><br />
<a href="http://www.voi/cinema/" class="c_fff s_4 c_ch">&#26368;&#26032;&#19978;&#26144;&#20043;&#27861;&#22283;&#38651;&#24433;</a><br />
<a href="http://www.voi/cinema-fr/" class="c_000 s_3 f_fr">FESTIVALS</a>
<a href="http://www.voi/cinema/" class="c_999 s_3 c_ch">&#23566;&#28436;</a><br />	
<a href="http://www.voi/cinema-fr/" class="c_fff s_3 f_fr">CINEMA FRANCAIS</a><br />
<a href="http://www.voi/cinema/" class="c_999 s_3 c_ch">&#22238;&#39015;&#23637;</a>	
<a href="http://www.voi/cinema-fr/" class="c_000 s_2 f_fr">AVANT-PREMIERES</a><br />
<a href="http://www.voi/cinema/" class="c_fff s_1 c_ch">&#25552;&#20379;&#32102;&#30332;&#34892;&#21830;&#20043;&#35036;&#21161;</a>
<a href="http://www.voi/cinema-fr/" class="c_999 s_2 f_fr">SORTIES</a>

</div>
</div></li>

<li><div id="pt_education">
<div id="pt_education_links">
<a href="http://www.voi/education-fr/" class="c_333 s_2 f_fr">CLASSES PREPA</a>
<a href="http://www.voi/education/" class="c_333 s_1 c_ch">&#30041;&#27861;&#35498;&#26126;&#26371;</a>
<a href="http://www.voi/education-fr/" class="c_fff s_1 f_fr">ALUMNI</a>
<a href="http://www.voi/education/" class="c_333 s_1 c_ch">&#27861;&#22283;&#25945;&#32946;&#20013;&#24515;</a>
<a href="http://www.voi/education-fr/" class="c_000 s_2 f_fr">SALON EUROPEEN DE L'EDUCATION</a>
<a href="http://www.voi/education/" class="c_333 s_1 c_ch">&#29518;&#23416;&#37329;</a>
<a href="http://www.voi/education-fr/" class="c_fff s_3 f_fr">COOPERATION UNIVERSITAIRE</a>
<a href="http://www.voi/education/" class="c_333 s_1 c_ch">&#25945;&#32946;&#23637;</a>
<a href="http://www.voi/education-fr/" class="c_333 s_2 f_fr">BOURSES</a>
<a href="http://www.voi/education/" class="c_333 s_1 c_ch">&#21488;&#27861;&#25945;&#32946;&#21512;&#20316;</a>
<a href="http://www.voi/education-fr/" class="c_fff s_1 f_fr">FRANCE</a>
<a href="http://www.voi/education/" class="c_333 s_1 c_ch">&#31805;&#35657;</a>
</div>
</div></li>

<li><div id="pt_expos">
<div id="pt_expos_links">
<a href="http://www.voi/expos-arts-visuels-fr/" class="c_333 s_2 f_fr">EXPOS</a>
<a href="http://www.voi/expos-arts-visuels/" class="c_333 s_1 c_ch">&#35222;&#35258;&#34269;&#34899;</a>
<a href="http://www.voi/expos-arts-visuels-fr/" class="c_fff s_1 f_fr">DESIGN</a>
<a href="http://www.voi/expos-arts-visuels/" class="c_333 s_2 c_ch">&#25976;&#20301;&#34269;&#34899;</a>
<a href="http://www.voi/expos-arts-visuels-fr/" class="c_000 s_2 f_fr">ARTS VISUELS</a>
<a href="http://www.voi/expos-arts-visuels/" class="c_333 s_1 c_ch">&#35373;&#35336;</a>
<a href="http://www.voi/expos-arts-visuels-fr/" class="c_fff s_3 f_fr">ARCHITECTURE</a>
<a href="http://www.voi/expos-arts-visuels/" class="c_333 s_1 c_ch">&#24314;&#31689;</a>
<a href="http://www.voi/expos-arts-visuels-fr/" class="c_333 s_2 f_fr">PEINTURE</a>
<a href="http://www.voi/expos-arts-visuels/" class="c_333 s_1 c_ch">&#25991;&#21270;&#36039;&#29986;</a>
<a href="http://www.voi/expos-arts-visuels-fr/" class="c_fff s_1 f_fr">ART NUMERIQUE</a>
<a href="http://www.voi/expos-arts-visuels/" class="c_333 s_1c_ch">&#32654;&#34899;</a>
</div>
</div></li>

<li><div id="pt_langue_fr">
<div id="pt_langue_fr_links">
<a href="http://www.voi/francais-fr/" class="c_333 s_2 f_fr">FRANCOPHONIE</a>
<a href="http://www.voi/francais/" class="c_333 s_1 c_ch">&#27861;&#35486;&#35506;&#31243;</a>
<a href="http://www.voi/francais-fr/" class="c_fff s_1 f_fr">STAGES</a>
<a href="http://www.voi/francais/" class="c_333 s_2 c_ch">&#21488;&#28771;&#27861;&#22283;&#25991;&#21270;&#21332;&#26371;</a>
<a href="http://www.voi/francais-fr/" class="c_000 s_2 f_fr">ENSEIGNER</a>
<a href="http://www.voi/francais/" class="c_333 s_1 c_ch">&#22312;&#21488;&#28771;&#23416;&#27861;&#25991;</a>
<a href="http://www.voi/francais-fr/" class="c_fff s_3 f_fr">ALLIANCE</a>
<a href="http://www.voi/francais/" class="c_333 s_1 c_ch">&#27861;&#22283;&#36938;&#23416;</a>
<a href="http://www.voi/francais-fr/" class="c_333 s_2 f_fr">FORMATIONS</a>
<a href="http://www.voi/francais/" class="c_333 s_1 c_ch">&#27861;&#35486;&#23416;&#32722;&#36039;&#28304;</a>
<a href="http://www.voi/francais-fr/" class="c_fff s_1 f_fr">COOPERATION LINGUISTIQUE</a>
<a href="http://www.voi/francais/" class="c_333 s_1 c_ch">&#22810;&#23186;&#39636;&#36039;&#26009;&#20013;&#24515;</a>
</div>
</div></li>

<li><div id="pt_livres">
<div id="pt_livres_links">
<a href="http://www.voi/livres-fr/" class="c_333 s_2 f_fr">EDITEURS</a>
<a href="http://www.voi/livres/" class="c_333 s_1 c_ch">&#26360;</a>
<a href="http://www.voi/livres-fr/" class="c_fff s_1 f_fr">ANNUAIRES</a>
<a href="http://www.voi/livres/" class="c_333 s_2 c_ch">&#27861;&#22283;&#26360;&#31821;</a>
<a href="http://www.vo/livres-fr/" class="c_000 s_2 f_fr">TRADUCTEURS</a>
<a href="http://www.voila.tw/livres/" class="c_333 s_1 c_ch">&#27861;&#22283;&#20986;&#29256;&#21830;</a>
<a href="http://www.voi/livres-fr/" class="c_fff s_3 f_fr"></a>
<a href="http://www.voi/livres/" class="c_333 s_1 c_ch">&#35695;&#32773;</a>
<a href="http://www.voi/livres-fr/" class="c_333 s_2 f_fr">SALONS DU LIVRE</a>
<a href="http://www.voi/livres/" class="c_333 s_1 c_ch">&#26360;&#23637;</a>
<a href="http://www.voi/livres-fr/" class="c_fff s_1 f_fr">EDITEURS</a>
<a href="http://www.voilivres/" class="c_333 s_1 c_ch">&#30446;&#37636;</a>
</div>
</div></li>

<li><div id="pt_medias">
<div id="pt_medias_links">
<a href="http://www.voi/medias-fr/" class="c_333 s_2 f_fr">TV5 MONDE</a>
<a href="http://www.voi/medias/" class="c_333 s_1 c_ch">&#27861;&#22283;&#38651;&#35222;&#21488;&#32178;&#36335;&#30452;&#25773;</a>
<a href="http://www.voi/medias-fr/" class="c_fff s_1 f_fr">AFP</a>
<a href="http://www.voi/medias/" class="c_333 s_2 c_ch">&#27861;&#22283;&#38651;&#21488;&#32178;&#36335;&#30452;&#25773;</a>
<a href="http://www.voi/medias-fr/" class="c_000 s_2 f_fr">I</a>
<a href="http://www.voi/medias/" class="c_333 s_1 c_ch">&#31532;&#22235;&#21488;&#33287; &#19978;&#25910;&#30475;&#27861;&#22283;&#38651;&#35222;&#21488;&#31680;&#30446;</a>
<a href="http://www.voi/medias-fr/" class="c_fff s_3 f_fr">France 24</a>
<a href="http://www.voi/medias/" class="c_333 s_1 c_ch">&#25910;&#32893;&#27861;&#22283;&#38651;&#21488;&#31777;&#26131;&#27861;&#25991;&#31680;&#30446;</a>
<a href="http://www.voi/medias-fr/" class="c_333 s_2 f_fr">TV</a>
<a href="http://www.voi/medias/" class="c_333 s_1 c_ch">&#27861;&#22283;&#33521;&#35486;&#31680;&#30446;&#38651;&#35222;&#21488;</a>
<a href="http://www.voi/medias-fr/" class="c_fff s_1 f_fr">EURONEWS</a>
<a href="http://www.voi/medias/" class="c_333 s_1 c_ch">&#26032;&#32862;</a></a>
</div>
</div></li>

<li><div id="pt_musiques">
<div id="pt_musiques_links">
<a href="http://www.voi/musiques-fr/" class="c_333 s_2 f_fr">DISQUES</a>
<a href="http://www.voi/musiques/" class="c_333 s_1 c_ch">&#28436;&#21809;&#26371;</a>
<a href="http://www.voi/musiques-fr/" class="c_fff s_1 f_fr">RADIOS</a>
<a href="http://www.voil/musiques/" class="c_333 s_2 c_ch">&#21809;&#29255;</a>
<a href="http://www.voi/musiques-fr/" class="c_000 s_2 f_fr">MUSIQUE EN LIGNE</a>
<a href="http://www.voi/musiques/" class="c_333 s_1 c_ch">&#32178;&#36335;&#32218;&#19978;&#25910;&#32893;&#27861;&#22283;&#38899;&#27138;</a>
<a href="http://www.voi/musiques-fr/" class="c_fff s_3 f_fr">CONCERTS</a>
<a href="http://www.voi/musiques/" class="c_333 s_1 c_ch">&#38899;&#27138;&#26371;&#33287;&#38899;&#27138;&#31680;&#20027;&#36774;&#21934;&#20301;&#20043;&#36106;&#21161;</a>
<a href="http://www.voi/musiques-fr/" class="c_333 s_2 f_fr">FESTIVALS</a>
<a href="http://www.voi/musiques/" class="c_333 s_1 c_ch">&#21488;&#28771;&#38651;&#21488;&#20813;&#36027;&#19979;&#36617;MP3</a>
<a href="http://www.voi/musiques-fr/" class="c_fff s_1 f_fr">MARCHE DU DISQUE</a>
<a href="http://www.voi/musiques/" class="c_333 s_1 c_ch">&#21476;&#20856;&#38899;&#27138;</a></a>
</div>
</div></li>

<li><div id="pt_scenes">
<div id="pt_scenes_links">
<a href="http://www.voi/scenes-fr/" class="c_333 s_2 f_fr">DANSE</a>
<a href="http://www.voi/scenes/" class="c_333 s_1 c_ch">&#33310;&#36424;</a>
<a href="http://www.voi/scenes-fr/" class="c_fff s_1 f_fr">OPERA</a>
<a href="http://www.voi/scenes/" class="c_333 s_2 c_ch">&#25138;&#21127;</a>
<a href="http://www.voi/scenes-fr/" class="c_000 s_2 f_fr">ART NUMERIQUE</a>
<a href="http://www.voi/scenes/" class="c_333 s_1 c_ch">&#34903;&#38957;&#34269;&#34899;</a>
<a href="http://www.voi/scenes-fr/" class="c_fff s_3 f_fr">ARTS DE LA SCENE</a>
<a href="http://www.voi/scenes/" class="c_333 s_1 c_ch">&#27468;&#21127;</a>
<a href="http://www.voi/scenes-fr/" class="c_333 s_2 f_fr">THEATRE</a>
<a href="http://www.voi/scenes/" class="c_333 s_1 c_ch">&#25976;&#20301;&#34269;&#34899;</a>
<a href="http://www.voi/scenes-fr/" class="c_fff s_1 f_fr">ARTS DE LA RUE</a>
<a href="http://www.voi/scenes/" class="c_333 s_1 c_ch">&#28436;&#20986;</a>
</div>
</div></li>

<li><div id="pt_sciences">
<div id="pt_sciences_links">
<a href="http://www.voi/sciences-fr/" class="c_333 s_2 f_fr">RECHERCHE</a>
<a href="http://www.voi/sciences/" class="c_333 s_1 c_ch">&#21488;&#27861;&#31185;&#25216;&#20132;&#27969;</a>
<a href="http://www.voi/sciences-fr/" class="c_fff s_1 f_fr">CHIMIE</a>
<a href="http://www.voi/sciences/" class="c_333 s_2 c_ch">&#30740;&#31350;</a>
<a href="http://www.voi/sciences-fr/" class="c_000 s_2 f_fr">C</a>
<a href="http://www.voi/sciences/" class="c_333 s_1 c_ch">&#29289;&#29702;</a>
<a href="http://www.voi/sciences-fr/" class="c_fff s_1 f_fr">COOPERATION SCIENTIFIQUE</a>
<a href="http://www.voi/sciences/" class="c_333 s_1 c_ch">&#21270;&#23416;</a>
<a href="http://www.voi/sciences-fr/" class="c_333 s_2 f_fr">PHYSIQUE</a>
<a href="http://www.voi/sciences/" class="c_333 s_1 c_ch">&#20154;&#25991;&#31185;&#23416;</a>
<a href="http://www.voi/sciences-fr/" class="c_fff s_1 f_fr">EFEO</a>
<a href="http://www.voi/sciences/" class="c_333 s_1 c_ch">&#29983;&#29289;</a>
</div>
</div></li>
</ul>	


</div> <!-- #menu -->

</div><!-- .entry-content -->
</div><!-- #post-## -->

</div><!-- #content -->
</div><!-- #container -->

<?php get_footer(); ?>

Et bien sûr, la feuille de style CSS qui va avec...

Merci d'avance pour le coup de main !!!

#main {
margin-top: 0;
padding-top: 47px;
height: 604px;
}

#colophon, #main, #wrapper {
background-color: transparent;
margin: 0 auto;
width: 850px;
}

#colophon {
border: none;
}

#container {
width: 621px;
}

#content {
width: 601px;
}

#primary {
width: 229px;
float: left;
}

body {
background: white url(images/bg_gd.png) 50% 0 no-repeat;
}

#logo-voila {
height: 111px;
}

#logo-bft {
border-bottom: 1px solid #09c;
margin-bottom: 10px;
}

#primary a {
color: #000;
text-decoration: none;
font-family: Helvetica;
line-height: 20px;
}

#primary a:hover {
text-decoration: underline;
}

#primary p {
margin-bottom: 0;
}

#primary #newsletter {
float: left;
}

#primary #mobile {
float: left;
display: block;
text-align: center;
width: 60px;
}

#primary #mobilech {
float: left;
display: block;
text-align: center;
width: 133px;
}

#primary #calendar {
float: right;
text-align: right;
}

#primary #facebook {
float: left;
}

#primary #twitter {
float: left;
display: block;
text-align: center;
width: 147px;
}

#primary #plurk {
float: right;
text-align: right;
}

#home .entry-content {
padding-top: 0;
padding-left: 100px;
}

#content #contact {
padding-left: 350px;
}

#content p {
margin-bottom: 0;
font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
font-size: 12px;
}

#content input {
margin-bottom: 5px;
font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
font-size: 12px;
line-height: 16px;
}

#content textarea {
height: 60px;
font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
font-size: 12px;
}

.div.wpcf7-response-output {
font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
font-size: 12px;
}

#footer {
background-color: #fff;
clear: both;
font-size: 12px;
overflow: hidden;
padding: 0;
padding-top: 10px;
width: 850px;
font-family: Arial, Helvetica, Tahoma, sans-serif;
}

#footer p {
color: #000;
font-size: 10px;
line-height: 17px;
}

#footer a,
#footer a:visited {
color: #000;
font-weight: bold;
font-size: 12px;
}

#footer .flogo {
float: left;
padding: 0;
width: 403px;
}

#footer .creds {
float: right;
padding: 0;
text-align: right;
width: 427px;
}

/* MENU ACCORDEON JQUERY */


.sm { list-style:none; width:488px; height:169px; display:block; overflow:hidden }
#menu ul { margin:0; }
.sm li { float:left; display:inline; overflow:hidden }

#menu {
width:297px;
background-position:right;
}

#pt_cinema { background: #9cf url(images/menu/cinema.png) no-repeat;height:169px;text-align:right;}
#pt_cinema_links { display:block;padding-left:56px;padding-right:5px}
#pt_cinema_links a:hover { color: #c60 }

#pt_education { background: url(images/menu/education.png) no-repeat;height:169px;text-align:right }
#pt_education_links { display:block;padding-left:56px;padding-right:5px }
#pt_education_links a:hover { color: #360 }

#pt_expos { background: url(images/menu/expos.png) no-repeat;height:169px;text-align:right }
#pt_expos_links { display:block;padding-left:56px;padding-right:5px }
#pt_expos_links a:hover { color: #603 }

#pt_langue_fr { background: url(images/menu/langue_fr.png) no-repeat;height:169px;text-align:right }
#pt_langue_fr_links { display:block;padding-left:56px;padding-right:5px }
#pt_langue_fr_links a:hover { color: #00c }

#pt_livres { background: url(images/menu/livres.png) no-repeat;height:169px;text-align:right }
#pt_livres_links { display:block;padding-left:56px;padding-right:5px }
#pt_livres_links a:hover { color: #630 }

#pt_medias { background: url(images/menu/medias.png) no-repeat;height:169px;text-align:right }
#pt_medias_links { display:block;padding-left:56px;padding-right:5px }
#pt_medias_links a:hover { color: #660 }

#pt_musiques { background: url(images/menu/musiques.png) no-repeat;height:169px;text-align:right }
#pt_musiques_links { display:block;padding-left:56px;padding-right:5px }
#pt_musiques_links a:hover { color: #303 }

#pt_scenes { background: url(images/menu/scenes.png) no-repeat;height:169px;text-align:right }
#pt_scenes_links { display:block;padding-left:56px;padding-right:5px }
#pt_scenes_links a:hover { color: #306 }

#pt_sciences { background: url(images/menu/sciences.png) no-repeat;height:169px;text-align:right }
#pt_sciences_links { display:block;padding-left:56px;padding-right:5px }
#pt_sciences_links a:hover { color: #030 }



#menu a { text-decoration: none;
/* line-height: 0px; */
}

/* couleur des liens */
#menu .c_ccc { color: #ccc } /* gris clair */
#menu .c_fff { color: #fff } /* blanc */
#menu .c_000 { color: #000 } /* noir */
#menu .c_333 { color: #333 } /* gris foncé */
#menu .c_999 { color: #999 } /* gris moyen */


/* nom de la police */
#menu a.f_fr { font-family: Arial;
font-weight: bold;
letter-spacing:-1px;
}

/* attributs polices chinoises */
#menu a.c_ch { font-family: Arial;
font-weight: bolder;
letter-spacing:-1px;
}


/* taille des liens */
#menu a.s_1 { font-size: 14px }
#menu a.s_2 { font-size: 18px }
#menu a.s_3 { font-size: 22px }
#menu a.s_4 { font-size: 26px }
#menu a.s_5 { font-size: 30px }
#menu a.s_6 { font-size: 34px }

Pas facile de comprendre ton problème en lisant le code...

Tu ne pourrais pas être plus explicite, du genre expliquer le problème en nommant spécifiquement les blocs que tu essais de redimensionner ? Là, on navigue avec des div dans des div, etc...

Si tu peux aussi nous montrer un printscreen que l'on se fasse une idée ?

Là j'avoue que tu auras de la difficulté à obtenir de l'aide si on doit chercher trop longtemps à comprendre simplement le problème....

Bref, plus tu es clair dans ta question, plus tu as de chances d'obtenir une réponse.

Merci beaucoup Mabelle de te pencher sur mon cas désespéré...
Je sais qu'il aurait été tellement plus simple de joindre un lien.
Mais comme tu pourras le constater avec les visuels, ça implique des chinois... Et il y a des choses avec lesquelles on ne rigole pas, là bas.

L'idée est de considérer dans la première serie de div celle qui est estampillée
<div id="pt_cinema_links" height="150px">

Bref, la première image est tirée d'IE, sans l'attribut line-height qui apparait dans la CSS à la ligne
#menu a { text-decoration: none;
/* line-height: 0px; */
}

Là, le résultat est ce que je veux (plus ou moins, mais après c'est une question de réglages...)


Cette 2ème, c'est toujours tiré d'IE, mais en appliquant le line-height (cf ci dessus)

Ca ne va pas du tout, mais c'est ce qui devrait normalement se produire avec un line-height à 0px, je présume.


Voilà maintenant une image tirée de Chrome avec le line-height à 0px:

Ca fonctionne

Et enfin, toujours tiré de Chrome, mais sans le line-height :



Bref, je pense que tu vois maintenant quel résultat je veux obtenir et où ça ne marche pas...

Impossible de contenir le texte dans une hauteur fixe :
<div id="pt_cinema_links" height="150px">
Et ça, ce n'est que le dernier endroit où j'ai essayé de placer l'attribut height...

En somme, si tu as d'autres idées...
Mais est-il possible de spécifier si une partie de la CSS doit être appliquée ou non, en fonction d'une détection du navigateur utilisé par l'internaute ???

En tout cas je ne remercierai jamais assez celles et ceux qui prennent le temps de se pencher sur mon cas...

Bonjour,

sans forcement nous donner le lien vers la page originale , ne te serait-il pas possible de refaire une simple page avec des textes bidons et qui surtout reproduit le bug que tu décrit.

Dans l'exemple de code que tu fournit, il manque par exemple le doctype utilisé, l’élément #main et le jquery.
Chez moi , chrome IE et firefox contiennent le texte.
Avec un line-height a zéro , ça déplait a Firefox ... et on n'a que la boite bleu.

Impossible de deviné ce qui provoque ce defaut (doctype erroné , erreur html, heritage de style d'un parent ou jquey qui ne cible pas seulement ce qu'il devrait, ou ...).

cordialement

Donc ça marcherait chez toi, GC nomade...
Alors c'est que le problème vient de plus haut dans le code, je suppose.

Mais je ne peux définitivement malheureusement pas donner de lien et vu que j'essaye de gérer la partie de code concernant ce jquery depuis Wordpress, je ne sais même pas comment récupérer le reste du code

Il va donc falloir que le dév qui a pondu ça daigne y jeter un oeil et se débrouille avec quand il sera de retour... Dans un mois.

Et un client pas content, un !

Merci en tout cas à tous ceux qui ont tenté de me donner un coup de main, c'est toujours réconfortant de ne pas se savoir tout seul !!!

bonsoir,

ce que tu peut faire c'est enregistrer en local la page web qu'affiche ton navigateur ou son code source , en prenant soin de récupérer aussi les fichiers de style et javascript liés.
Pour le jquery, il suffirait que tu n'indique que le plugin tu utilises et comment tu l'initialises.

Une fois cette page rapatrié en local et au format html, il ne te reste plus qu'a élaguer la page en gardant le strict nécessaire pour reproduire le bug . (pour les images , tu peut les remplacer avec par exemple : http://lorempixum.com/ ou http://dummyimage.com/ ou de simples couleurs pour les fonds.
Pour les textes retires les ou remplaces les avec du "lorem ipsum" ... enfin élague de l’entête de la page (<head> ) les trucs qui ne nous intéresse pas .
Il te reste alors a vérifier si le bug perdure et à nous proposer cette version simplifiée anonyme en test.

Bonne continuation

Ah ben finalement ça marche, j'ai réussi mon coup...
Tout ça pour une histoire de <br />...
J'vous jure !

Encore une fois merci à ceux qui ont tenté de me donner un coup de main alors que je n'ai pas rendu les choses vraiment faciles.

Sans vouloir vous vexer, je vous dis à "le plus tard possible" !


(juste un truc : comment je fais apparaître le topic en "résolu" ? Histoire de boucler la boucle proprement...)