Bon je remonte mon sujet, je suis une quiche en CSS...
Je n'arrive pas à gérer un text-overflow correctement.
Via ma page (http://buzzy.free.fr/test_cal.php), en cliquant sur la série hung puis la saison 1, j'ai tout mon tableau qui se décale et je n'arrive pas à savoir pourquoi...
Ca ne fonctionne ni sous IE ni sous Chrome.
La construction est la suivante :
Code :
- - div (tab_arrondi) : tableau des séries suivies
- > div (tabarr_contenu) : contenu du tableau précédent
- > div (liste_series)
- > div (serie_saisons) : contient la saison (titre + épisodes)
- > div (saison_episodes) : contient la liste des épisodes
- > table
- > tr (episode_entete)
- > td (episode_titre) : titre
- > td (episode_statut) : icone ou date
|
Pour la fin avec la table, j'ai également testé en conservant des divs et ça ne marchait pas non plus 
Et voici le CSS correspondant :
Code :
- div.tab_arrondi {
- background-color: #8EABD7;
- margin-bottom: 10px;
- border-top-left-radius: 10px;
- border: solid 1px #8EABD7;
- }
- div.tabarr_contenu {
- background: #fff;
- padding: 3px;
- }
- .saison_episodes{
- width: 100%;
- border-spacing: 0;
- border-collapse: collapse;
- text-align: left;
- font-size: 12px;
- }
- .serie_entete, .saison_entete, .episode_entete
- {
- background: #FFFFFF;
- width: 100%;
- height: 18px;
- }
- .episode_titre {
- padding: 0 0 0 10px;
- text-overflow: ellipsis;
- overflow: hidden;
- white-space: nowrap;
- width: 90%;
- }
- .episode_statut {
- white-space: nowrap;
- width: 18px;
- text-align: right;
- }
|
Au cours de mes tests, j'ai pas mal touché à tout dans tous les sens.
Certaines lignes n'ont peut être plus lieues d'être ou n'ont pas de sens...
D'avance merci pour votre aide !
