28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'aurais voulu savoir comment faire pour avoir des largeurs sur un block en position absolute.

Je m'explique, j'imerai que le block est un min-width et un max-width, mais que entre les deux en fonction du texte la taille s'adapte toute seul.

Est-ce possible ?

Merci
Modérateur
a écrit :
le width: auto ne marche en absolute

J'ai du mal à voir en quoi positionner un élément en absolute influe sur la largeur du texte qu'il contient...

A moins que tu souhaites lui donner une taille auto en fonction d'autres éléments (eux même en absolute) qu'il contient.
Par défaut, il prend la largeur le l’élément parent mais reste bloquer a cette largeur même si le contenu change.
Modérateur
Effectivement j'avais pas vu ça comme ça. Mais du coup il faudrait aussi passer ton conteneur en width:auto; pour qu'il s'ajuste à la taille de l’élément qu'il contient qui va lui-même s'adapter a la taille de son texte.
Après tout dépend que ce que tu veux faire et de ton code mais ça j'en ai aucune idée... (j'ai commandé des supers pouvoirs de vision pour noël ! ça arrive ! Smiley ravi )
Héhé Smiley smile . Si tu veux voir va ici.

Les liens du menu du haut affiche les block au survol, tu verra surement mieux mon souci Smiley cligne .
Modifié par Boris56 (12 Dec 2011 - 16:57)
Modérateur
Ha cool merci Smiley smile

Effectivement c'est pas évident... Smiley sweatdrop
Tu peux toujours mettre une largeur fixe a chacun de tes blocks (comme le margin que tu leur applique finalement*) mais au revoir la solution générique.

*d’ailleurs tu es bien obligé d'avoir une largeur définie pour faire un centrage avec 50% et margin negatif nan ? si ton bloc s'ajuste au texte mais que ton margin est fixé, il ne sera pas centré..

Autre alternative, tu sors les blocs de leurs parent mais la ça va vite etre le bordel pour le placement !


Sinon je pense que je passe mon tour Smiley sweatdrop
Bon courage


ps : belle réalisation ! J'aime bien le graphisme
Modifié par _laurent (12 Dec 2011 - 14:52)
Un largeur fixe, mais le problème resterai le même, si pas assez de contenu, block trop grand, trop de contenu block trop petit.

J'ai mis un min-width, histoire d'avoir un minimum de style, mais c'est un script qui calcul la largeur pour lui appliquer le bon margin négatif pour le centré mais, si j’enlève le min-width il bloque sur la largeur du parent.

Bref, c'est un cercle vicieux Smiley biggol , si tu abandonne je t'en voudrais pas promis Smiley langue .

PS : Merci.
Modérateur
En fait ce que je voulais dire c'est d'appliquer une largeur fixe différente à CHAQUE bloc.
En gros dans le code de chaque bloc :
<span class="menu-item-desc" style="margin-left: -45px;">

il faudrait définir une lageur
<span class="menu-item-desc" style="margin-left: -50px; width:100px;">

au lieu de tenter de définir une largeur auto dans la classe "menu-item-desc" afin que ça marche pour toute les autres.
Et la du coup ton bloc pourra déborder.

enfin la c'était assez bourrin faut faire ça joliment avec des id Smiley murf
Modifié par _laurent (12 Dec 2011 - 16:49)
Je pense que je vais mettre un largeur fixe unique et faire un choix sur la taille du contenu, en attendant de trouver plus pratique. Smiley langue
Haha, j'ai trouvé !

Pas de left 50%;, mais un text-align: center avec un display: inline-block pour le hover est sa marche.

Le width est bien automatisé !