• STATISTIQUES
  • Il y a eu un total de 0 membres et 50749 visiteurs sur le site dans les dernières 24h pour un total de 50 749 personnes!
    Membres: 2 605
    Discussions: 3 579
    Messages: 32 816
    Tutoriels: 78
    Téléchargements: 38
    Sites dans l'annuaire: 58


  • ANNUAIRE
  • [EN] Hack This Site
    Hack This Site est considéré comme un réel terrain d'entraînement légal pour le...
    Hacking
    [EN] CS Tutoring Center
    Site de challenge spécialisé dans les challenges de programmation C++ et java cependant, d'autres langages pe...
    Challenges
    [EN] wechall
    Pour les gens n'étant pas familiers avec les sites de challenges, un site de challenges est un site propos...
    Hacking
    [EN] Sabre Films
    Site de challenge présenté sous la forme d'une quête. Vous êtes un détective et devrez résoudre d...
    Challenges
    [EN] osix
    Site de challenge qui utilise un système de level on chaque épreuve doit être réussie avant d'accédÃ...
    Challenges
    [FR] Forum-Webmaster
    Une communauté webmaster pour apporter / recevoir de l'aide en création de site internet. Webmaster...
    Webmaster
    [FR] InfoMirmo
    Apprentissage de l'informatique par l'intermédiaire de challenges de sécurité. Venez app...
    Hacking

  • DONATION
  • Si vous avez trouvé ce site internet utile, nous vous invitons à nous faire un don du montant de votre choix via Paypal. Ce don servira à financer notre hébergement.

    MERCI!

    €



Note de ce sujet :
  • Moyenne : 0 (0 vote(s))
  • 1
  • 2
  • 3
  • 4
  • 5
[Html/Css] Positionnement de textes
27-02-2012, 20h50 (Modification du message : 19-11-2012, 19h04 par InstinctHack.)
Message : #1
P4ND4 Hors ligne
Newbie
*



Messages : 8
Sujets : 2
Points: 0
Inscription : Dec 2011
[Html/Css] Positionnement de textes
Bonsoir,
Alors voila je suis en train de faire un site web avec du html et du css. Le probleme c'est que je n'arrive pas à mettre ma sidebar à gauche et mon contenu à droite! Je sais très bien comment on positionne en css mais là... Sa ne marche pas, mon contenu est à droite mais ma sidebar est à gauche en bas. Et je veut quel sois a la même hauteur que mon contenu! Help Me Please!
Bonne Soirée A bientot!
PS: Désolé pour les fautes d'orthographes!
+1 (0) -1 (0) Répondre
27-02-2012, 20h56
Message : #2
supersnail Hors ligne
Éleveur d'ornithorynques
*******



Messages : 1,609
Sujets : 71
Points: 465
Inscription : Jan 2012
RE: Positionnement de textes.
Bonjour,

Un bout de code (html/css) serait pas de refus Wink
+1 (0) -1 (0) Répondre
27-02-2012, 21h02 (Modification du message : 27-02-2012, 21h11 par supersnail.)
Message : #3
P4ND4 Hors ligne
Newbie
*



Messages : 8
Sujets : 2
Points: 0
Inscription : Dec 2011
RE: Positionnement de textes.
CSS :
Code :
.sidebar_item
{ padding: 0 0 0 15px;
  width: 201px;}

.sidebar_item h1
{ padding: 20px 0 10px 0;
  margin: 0;}
HTML :

Code :
<div style="width:250px; float:top; margin-left:20px;">
            <div style="width:200px; float:top;"></div>
              <br style="clear:both;" />
        <h3>Actualité du projet</h3>
              <div style="width:50px; float:top;"></div><p>Rejoingnez le projet Véganisation sur Facebook, <a href="http://www.facebook.com/pages/Projet-Veganisation/263832010355376">Cliquez ici</a></p>
            <div style="width:200px; float:top;"><h2>Useful Information</h2></div>
              <br style="clear:both;" />
        <div style="width:50px; float:top;"><img src="images/icons/info.png" alt="info"/></div>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque cursus tempor enim. Aliquam facilisis neque non nunc posuere eget volutpat metus tincidunt</p>
        <div style="width:50px; float:top;"><img src="images/icons/info.png" alt="info"/></div>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque cursus tempor enim. Aliquam facilisis neque non nunc posuere eget volutpat metus tincidunt</p>
        </div>
          <br style="clear:both;" />
    </div>
      </div>
    </div>
+1 (0) -1 (0) Répondre
27-02-2012, 21h03 (Modification du message : 27-02-2012, 21h13 par supersnail.)
Message : #4
(Y/n)
Non-enregistré



 
RE: Positionnement de textes.
Salut P4NDA Smile

Tout d'abord je te conseil de bien assimiler le cour sur HTML5/CSS3 de Matéo21 sur le site du zéro (http://www.siteduzero.com/tutoriel-3-136...-css3.html)

Ensuite, personnellement, je mettrais mon un id à ma sidebar et mon contenu :

Code HTML:
Code :
<div id="sidebar"><!-- Ta sidebar ici --></div>
<div id="corps"><!-- Ton contenu ici --></div>

Ensuite positionner les block en position absolut ou relative (j'avoue préférer le positionnement absolut) donc :

Code CSS:
Code :
#sidebar
{

     position:absolute;
     margin-top:/* Tu mets une valeur en pixel comme par exemple : 120px*/;
     margin-bottom:/* Tu mets une valeur en pixel comme par exemple : 120px*/;
     margin-left:/* Tu mets une valeur en pixel comme par exemple : 120px*/;
     margin-right:/* Tu mets une valeur en pixel comme par exemple : 120px*/;

}

#corps
{

     position:absolute;
     margin-top:/* Tu mets une valeur en pixel comme par exemple : 120px*/;
     margin-bottom:/* Tu mets une valeur en pixel comme par exemple : 120px*/;
     margin-left:/* Tu mets une valeur en pixel comme par exemple : 120px*/;
     margin-right:/* Tu mets une valeur en pixel comme par exemple : 120px*/;

}

margin signifie la marge extérieur de ton block mais tu peux utilisé padding pour la marge intérieur, top veux dire haut, bottom c'est bas, right c'est droite et left gauche (logique Tongue)

Voila avec ça tu devrais t'en sortir Smile

Cordialement,

(Y/n)

Edit : Tu devrais pas mettre trop de CSS dans ton HTML Smile Question de lisibilité pour toi Wink Et fais des commentaires dans ton code ! :p
positive (0) negative (0) Répondre
27-02-2012, 21h16
Message : #5
supersnail Hors ligne
Éleveur d'ornithorynques
*******



Messages : 1,609
Sujets : 71
Points: 465
Inscription : Jan 2012
RE: Positionnement de textes.
Bonjour,

Je suis d'accord concernant ce que dit (Y/n) concernant le html (au sujet des ID), par contre ne JAMAIS (sauf cas particuliers) utiliser le position pour mettre en place un site !

Tout simplement parce que chaque navigateur interprétant la page "à sa façon", les positions peuvent être toutes décalées d'un navigateur à l'autre.
L'utilisation des float:left (ou float:right) accompagnés de margin sont à préférer pour ce genre de choses.
+1 (0) -1 (0) Répondre
27-02-2012, 21h21
Message : #6
(Y/n)
Non-enregistré



 
RE: Positionnement de textes.
Je n'ai jamais eu de problème pour le moment Tongue

Mais je vais pas attendre d'en avoir pour agir, merci Smile

Cordialement,

(Y/n)
positive (0) negative (0) Répondre
27-02-2012, 21h24 (Modification du message : 27-02-2012, 21h27 par Venoa.)
Message : #7
Venoa Hors ligne
Newbie
*



Messages : 6
Sujets : 1
Points: 0
Inscription : Feb 2012
RE: Positionnement de textes.
Personnellement j'utiliserai un float: left pour ce qui va à gauche puis un Margin pour garder le reste espacer ...
Est-ce bien ce que tu demandais ?
+1 (0) -1 (0) Répondre


Sujets apparemment similaires…
Sujet Auteur Réponses Affichages Dernier message
  [CSS] Probleme de positionnement sakiir 3 249 02-01-2013, 12h42
Dernier message: sakiir
  [Html/Javascript] Comment cachées les informations que contienne une variable ? WizOut 22 1,024 21-10-2012, 14h15
Dernier message: sakiir
  [Html] Pas assez rigoureux ?? Trukrone' 15 828 29-04-2012, 16h13
Dernier message: EpicOut
  [Php] Comment transformer le BBCode en HTML CyberSee 0 186 17-06-2011, 04h23
Dernier message: CyberSee

Atteindre :


Utilisateur(s) parcourant ce sujet : 1 visiteur(s)
N-PN
Accueil | Challenges | Tutoriels | Téléchargements | Forum | Retourner en haut