Petit conseil CSS SVP

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Petit conseil CSS SVP

Profil supprimé

Bonjour,

J'ai crée des div nommés "cadre" qui ont des tailles spécifiés.
Ces div sont eux même contenu dans un div nommé "contenu".

1.Malgres que le div contenu spécifie texte-align:center; des div cadres se mettent tous a gauche.
2.Ce que je souhaite, c'est que ces div "cadre" s'alignent d'eux même toute la taille du div "contenu" puis passent a la ligne eux meme.

Le problème c'est qu'avec le inline, ils ne gardent pas la taille spécifiée et deviennent rikiki (cad: de la taille du texte).

Merci à vous.

Message édité par Profil supprimé le 11-07-2008 à 14:29:42

Publicité

David Boring

Code :

div#contenu div {width:100%}

Si j'ai compris ce que tu voulais faire !

Message édité par David Boring le 11-07-2008 à 14:41:21

Profil supprimé

Non, en faite il y a plein de petits div "cadre".

David Boring

Code :

div#contenu div {float:left}

dans ce cas. Les blocs se mettront à la suite l'un de l'autre

Profil supprimé

on avance,cela s'aligne, merci.

Maintenant j'aimerais que mon contenu, malgré l'alignement, reste centré.

Martius

il/lui

tu veux que l'ensemble des petit div soient centrés ou le contenu de chaque div doit être centré ?

---------------
Martin

Profil supprimé

l'ensemble des div.

Martius

il/lui

dans ce cas, tu englobes tous des "petits div" dans un "grand div" comme ça :

Code :

div#grand-div {
width: lataille;
margin: 0 auto;
}

ça devrait suffire, par contre, ça ne marche pas si tu as par exemple un grand div qui fait 300px et deux petits qui font 120px, il y aura un décalage à droite de 60px.

A ma connaissance, il n'y a pas moyen de centrer une série de flotants si la taille varie, puisque par définition un flotant se place d'un côté ou de l'autre. Sinon, il faut redimensionner le grand div dynamiquement, et ça implique une couche de javascript du genre pas terrible.

Message édité par Martius le 11-07-2008 à 16:51:01

---------------
Martin

Profil supprimé

cela ne fontionne pas, voici le code:

///le contenant///
#cadre{
text-align:center;
margin:20px;
margin-left : auto;
margin-right : auto;
}

///les mini cadres//
.contenu{
float:left;
text-align:center;
margin-left : auto;
margin-right : auto;
background-image : url("../images/cadre.png" );
background-repeat : no-repeat;
width : 273px;
height : 78px;
font-family:Script MT Bold;
}

Message édité par Profil supprimé le 11-07-2008 à 16:58:12

Profil supprimé

j'ai corrigé mon message.

Message édité par Profil supprimé le 11-07-2008 à 16:56:14

Publicité

Martius

il/lui

il faut préciser la largeur du #cadre pour que ça marche, c'est obligatoire.
par ailleurs, il faudra probablement ajouter un conteneur vide qui rétablirait l'ordre normal

<div id="cadre">
...
<div style="clear: left;"></div>
</div>

---------------
Martin

mIRROR

Chevreuillobolchévik

Code :

///le contenant///
body {text-align:center;}
#cadre{margin:20px auto;overflow:hidden;_overflow:visible;zoom:1;}
 
///les mini cadres//
.contenu{
float:left;
text-align:center;
margin:0 auto;
background: url("../images/cadre.png" ) no-repeat;
width : 273px;
height : 78px;
font-family:Script MT Bold;// police inconnue et il faut préciser la famille
}

---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell

Profil supprimé

Merci pour ces infos précieuses, l'idée de Martius fonctionne, merci miIRROR.
Merci à tous pour votre aide chaleureuse.

FORUM HardWare.fr

Programmation

HTML/CSS

Petit conseil CSS SVP

Sujets relatifs
Probleme Mise en page HTML et CSS	Conseil creation bdd
[CSS] 100% - 100px	[CSS] Marge correcte seulement sur IE
Problème d'image background en CSS sortie d'Adobe...	Popup CSS, avec désactivation de la page courante
imbrication de balise CSS	Formattage du texte en CSS avec white-space
Un petit batch avec boucle / Call / parametre et condition	Perte d'interactivité sur un bouton en lui appliquant une classe CSS
Plus de sujets relatifs à : Petit conseil CSS SVP

Page générée en 0.068 secondes