[demi-résolu][CSS]Problème de (max-)width et de border ...
Forum Programmation : [demi-résolu][CSS]Problème de (max-)width et de border ...
Hello !
Bon je vais essayer d'être simple :
(je vous ai mis le code en dessous)
j'ai une photo qui se cale à droite avec le texte à gauche ...
1° prob : le <div id="valign"> ne centre pas la photo sur la hauteur
2° prob : le <p id="entete"> possède une bordure ... mais celle ci ne se stop pas "à la fin" du texte ... elle continu jusqu'au bord qui est complètement à droite du document ... la bordure passe sur la photo si vous préfrez ... j'ai pourtant essayé width et max-width ...
<div id="valign">
<img id="photo" ...etc... />
<p id="entete"> bloc 1 </p>
</div>
******************************
#valign{
vertical-align:middle}
#photo{
float:right;
border:3px solid black;
border-radius:15px;
-moz-border-radius:15px;
padding:10px;}
#entete{
position:relative;
width:auto;
border:3px solid black;
border-radius:15px;
-moz-border-radius:15px;
padding:10px;}
*****************************
help me !!! ca fait 2 jours que je passe là dessus
Message édité par gryphus71 le 29-05-2007 à 16:36:24
Salut,
1) Tu n'as pas mis de valeur pour l'attribut vertical-align, c'est normal ?
2) Si ta bordure prend tout, c'est parce que tu es dans un paragraphe (p), essaie de mettre un span à la place.
Déjà merci de m'avoir répondu ![]()
1) c'était un oublie dans le poste mais dans mon code j'ai bien mis vertical-align:middle
(1°post édité)
2)j'ai essayé les 2 solutions suivante, la résolution de mon problème avance
mais maintenant c'est trop lol l'encadrement se fais sur toutes les lignes de mon entête...j'explique juste après...
j'ai donc essayé ces 2 solutions :
<div id="valign">
<img id="photo" ...etc... />
<span id="entete"> bloc 1 </span>
</div>
***********************
<p id="valign">
<img id="photo" ...etc... />
<span id="entete"> bloc 1 </span>
</p>
mon bloc 1 est en fait de ce style :
Nom Prénom
Adresse
Numéro de tél
***********
en code j'ai donc fais :
...>nom prénom<br />adresse<br />numéro de tél<...
et avec ces 2 codes le résultat est le même : l'encadrement se fait ligne par ligne : j'ai un encadrement par ligne ![]()
alors que je voudrais un seul encadrement : autour du "bloc" entete
Message édité par gryphus71 le 29-05-2007 à 12:43:05
en fait je vois pas trop...
Tu pourrais mettre un peu plus de code concret ?
Code :
|
ca donne ca :
(bien entendu j'ai retiré mes informations personnelles ^^)
Ouais, j'oubliais. Tu ne dois pas pouvoir sauter de lignes dans un span...
Alors, une solution serait de repasser avec un paragraphe, mais de mettre une margin-left égale à la largeur de ton image. Ca devrait régler le soucis
ok bah merci pour cet aide, j'vais essayer de me débrouiller avec tout ca
++
j'avais pas beaucoup de temps pour expliquer.
Mais en clair ça donnerait :
<div id="valign">
|
et pour le CSS :
#entete {
|
Désolé dans mon précédent message, je t'ai dit margin-left, mais c'est margin-right
pas de problème t'inquiètes pas j'avais tout compris
mais au final j'vais simplement faire avec un table lol pas taper ^^
nan mais ce cv va me servir pour postuler en temps que webmaster donc je veux un code parfait et je voulais éviter un table pour du texte+image ...
mais en fait ca se défend car dans ce cas j'utilise l'entête + l'image avec une présentation comme un tableau puisque je ne veux pas que ca soit mélangé au texte dessous + un table me permettra de gérer facilement le positionnement à gauche de l'entete et le positionnement à droite + le centrage en hauteur de la photo
merci quand même car ca m'a permis de savoir exactement la différence d'utilisation entre div et span !
Comme tu veux, bah bon courage alors
merci mais les tableaux c'est "easy" lol
Il y a 2799 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.
