rss
Ils ont besoin de votre aide Tous les messages sans réponse
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Résolu

[CSS] problème de marge ?

Posté par Riwalenn, le lundi 2 avril 2007 à 16:34:52
Bonjour,

j'ai fait le code css suivant : 

<style type="text/css" media="screen">
#boitelogin {
float: right;
width: 300px;
height: 0px;
border: 0px;
margin: 10px 10px 0px 0px;
}
</style>


mais cela me donne le résultat suivant :
http://www.operationrecyclage.com/images/forums/2.jpg

alors que mon fond devrait donner ceci :
http://www.operationrecyclage.com/images/forums/3.jpg

j'ai beau changer les marges (margin), y'a rien à faire, le fond se duplique encore plus...
quelqu'un a t'il une idée où je me suis plantée...

merci par avance ! Cordialement,
Riwalenn
Configuration: Windows XP
Internet Explorer 6.0
Répondre à Riwalenn  Signaler ce message aux modérateurs Aller au dernier message

1


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Riwalenn, le lundi 2 avril 2007 à 16:47:41
autant pour moi j'ai trouvé en regardant mon code pour poser ma question... j'avais des espaces en trop...

par contre j'ai un problème avec mon formulaire, j'aurais aimé qu'il se trouve graphiquement sur la base du trait de mon arrière plan (en bas) :
http://www.operationrecyclage.com/images/forums/4.jpg

mon code est le suivant dans le body : 

    <td width="988" height="95" valign="bottom" background="../img/layout/headerrow.jpg"> 

      <div id="boitelogin"> 
        <form name="form1" method="post" action="">
          <div align="right"> 
            <input name="textfield" type="text" class="login" value="nom d'utilisateur">
            &nbsp; 
            <input name="textfield2" type="text" class="login" value="mot de passe">
            &nbsp; 
            <input name="Submit" type="button" class="login" value="ok">
            &nbsp;</div>
        </form></div></td>

si quelqu'un peut m'aider... Cordialement,
Riwalenn
   
Répondre à Riwalenn

2


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Gihef, le lundi 2 avril 2007 à 17:19:35
Bonjour,

Peut-on avoir les styles des :
  bloc qui contient la suite (dont on voit le dessin. En-tête ?)
  <table qui contient le <td qui contient la suite
  <td
  <div id="boitelogin">
  <form
  <div align="right"
  <input class="login"
?

+ Pour l'espacement, essaye de remplacer les &nbsp; par du padding appliqué à tes <input
 
   
Répondre à Gihef

3


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Riwalenn, le lundi 2 avril 2007 à 18:00:29
la-dedans j'ai juste le style login (dans le formulaire) : 

<input class="login" 


.login {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	color: #000000;
	background-color: #99CCFF;
	border: 1px solid #000000;

}


sinon ça se présente comme ceci : 

<body background="../img/layout/melts.jpg">
<table width="988" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr> 
    <td width="988" height="95" valign="bottom" background="../img/layout/headerrow.jpg"> 

      <div id="boitelogin"> 
        <form name="form1" method="post" action="">
          <div align="right"> 
            <input name="textfield" type="text" class="login" value="nom d'utilisateur">
            &nbsp; 
            <input name="textfield2" type="text" class="login" value="mot de passe">
            &nbsp; 
            <input name="Submit" type="button" class="login" value="ok">
            &nbsp;</div>
        </form></div></td>
  </tr>
  <tr> 
    <td background="../img/layout/middlerow.jpg" class="textemenu"> <table width="100%" height="26".... et ça continue
Cordialement,
Riwalenn
   
Répondre à Riwalenn

4


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Serge_La, le lundi 2 avril 2007 à 19:52:21
Bonjour,

Si tu veux aligner quelque chose sur l'image de fond, je ne vois pas d'autre solution que de mettre position: absolute. Sur ton div#boitelogin et de mettre top: nnpx où nn est la position en pixel de ta ligne dans ton image de fond. Et puis left: mmpx pour la position horizontale.

Serge.
   
Répondre à Serge_La

5


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le lundi 2 avril 2007 à 21:29:18
pfff...

avec un bitmap et deux bouts de code, c'est pas très évident.
de ce que j'en ai compris il faudrait appliquer une hauteur au <div>, qu'il soit en position:relative.
après je pensais essayer de positionner les <input> avec position:absolute et bottom:0.

si tu ne vois pas ce que je veux dire, moi je ne vois pas ce que tu veux faire !

en tous cas, bon courage !

[ Mathieu ]
savoir rester faignant, c'est progresser en informatique. enfin, j'essaie...
   
Répondre à Dalida

6


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Gihef, le lundi 2 avril 2007 à 22:20:34
Il est vrai que tu es un peu chiche dans les info. que tu donnes.

Essaye :
form#log {
    margin : 0;
    padding : 0;
    }
et
<form id="log" name="form1" method="post" action="">

 
   
Répondre à Gihef

7


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le lundi 2 avril 2007 à 22:58:38
oui, tu peux même l'appliquer à <input> qui par défaut doit être margé... [ Mathieu ]
savoir rester faignant, c'est progresser en informatique. enfin, j'essaie...
   
Répondre à Dalida

8


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
 Riwalenn, le mardi 3 avril 2007 à 17:34:41
excellent c'était vraiment ce que je recherchais !!!! Merci Gihef ça m'enlève une épine du pied :)) Cordialement,
Riwalenn
   
Répondre à Riwalenn
Posez votre question Répondre
Logiciels pertinents trouvés dans les téléchargements
Télécharger Web Developer Toolbar 1.1.6Web Developer Toolbar - WebDeveloper est une extension firefox représentant une formidable boîte à outils pour examiner et manipuler les pages...Catégorie: Extensions Firefox
Licence: Freeware/gratuit
Télécharger Amaya 9.54Amaya - Amaya est un éditeur Web, développé conjointement par l'INRIA et le W3C, pour éditer et publier très simplement des pages...Catégorie: Editeurs HTML
Licence: Open Source
Télécharger Firstpage 2006Firstpage - First Page 2006 est un éditeur html gratuit et excellent. Il permet de travailler un code HTML en couleur, ainsi que de...Catégorie: Editeurs HTML
Licence: Freeware/gratuit
Télécharger Matizha Sublime 3.2Matizha Sublime - Matizha Sublime 3 est un outil de choix pour tout webmaster sérieux à propos de la création de pages web. D’abord un...Catégorie: Editeurs HTML
Licence: Freeware/gratuit
Plus de logiciels gratuits sur « [CSS] problème de marge ? »