Comment limiter un titre de sujet en fonction de la résolution

[mdlettrage]

Bonjour,

Grâce à Neptunia (que je remercie encore), j'ai pu faire en sorte que mes icônes de sujets/messages soient à la bonne place comme sur ce forum ... donc à droite.

Cependant, cela a engendré un problème nouveau lié à ces icônes par rapport aux titres.

En clair, mon forum étant en résolution automatique, quand je suis sur un écran réglé en 1024 pixels de large, le titre de mon exemple passe sur mon icône. (voir photo 1 ci dessous)
Quand je suis en 1280 pixels de large, nickel tout est tout beau. (voir photo 2 ci-dessous)

Pour résoudre ce problème, j'aimerais

- soit savoir comment faire en sorte que le titre passe à la ligne suivante s'il dépasse x pourcent de la colonne
- ou mieux, savoir comment réserver 110 pixels à droite pour que rien ne puisse venir ennuyer l'icône sujet.

Voici les photos

en 1024

en 1280


Je suis en PHBB3 et l'adresse du forum est

csap-liege.forumactif.be

Merci d'avance pour votre aide que je reconnais comme vraiment précieuse.

[Neptunia]

Re bonjour ^^


Ajoutez à votre feuille de style CSS :

Code:

.topiclist.topics .row dl dd.dterm {
    padding-right: YYpx;
}

en remplaçant YY par le nombre de pixels de votre icône la plus large, majoré de 10. Si votre image fait 60 pixels de largeur, mettez 70px.

[demeter1]

Bonjour,
ce css devrait fonctionner :

Code:

div.topic-title-container {
  width: 83%;
  display: inline-flex!important;
}

A voir si cela ne pose pas de soucis autre part (moi et phpbb3, ça fait deux)

Edit : sorry Neptunia, j'ai envoyé le message malgré l'alerte de dépôt d'un autre message

[mdlettrage]

Merci Neptunia mais ...

cela ne marche pas ou, pour être plus clair, cela réserve bien l'espace mais cela en profite pour tout décaler après (voir photo)



il faut donc oublier mon option 2 qui est de réserver un espace et revenir sur l'option 1 de limiter le titre à x pourcent de la colonne ...

allez, je sens que la solution est proche , courage (dit celui qui reste derrière son clavier à crier au secours)

[demeter1]

Je ne sais si vous avez testé la solution donnée sur mon dernier message . En faisant varier la résolution d'écran jusqu'à 400% (non testé au delà) , voici ce que j'obtiens :

[mdlettrage]

Bonjour,
ce css devrait fonctionner :

Code:

div.topic-title-container {
  width: 83%;
  display: inline-flex!important;
}

A voir si cela ne pose pas de soucis autre part (moi et phpbb3, ça fait deux)

Edit : sorry Neptunia, j'ai envoyé le message malgré l'alerte de dépôt d'un autre message

Et hop, cette fois, ce sera Demeter1 qui gagne !

Merci Demeter1, ta solution fonctionne à la perfection. Si je m'y connaissais comme vous deux, je serais heureux... Moi je suis plutôt axé graphisme.

Bref, voici encore une demande rondement menée grâce à vous deux et la gentillesse de toute l'équipe donc 1000 merci (et au plaisir de vous être utile un jour).

Marc