IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

Créer une page sur deux colonnes


Sujet :

Tableau en CSS

  1. #1
    Membre éclairé
    Homme Profil pro
    Ingénieur en électrotechnique retraité
    Inscrit en
    Décembre 2008
    Messages
    1 590
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 72
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Ingénieur en électrotechnique retraité

    Informations forums :
    Inscription : Décembre 2008
    Messages : 1 590
    Points : 813
    Points
    813
    Par défaut Créer une page sur deux colonnes
    Bonjour,

    Je crée une page sur deux colonnes. La colonne de gauche est de largeur fixe. La colonne de droite occupe l'espace restant.
    Jusqu'à maintenant, j'utilisais les boîtes flexibles (flex).

    Dans mon cas, relativement simple, il me semble plus facile d'utiliser grid-template-columns que je ne connaissais pas jusqu'à aujourd'hui.
    J'essaye donc ceci:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    #mainSection
    {
    	width:100%;
    	grid-template-columns:230px 1fr;
    }
    #left
    {
    	margin:0;
    	padding:3px;
    	font-size:.9rem;
    }
    #right
    {
    	padding-left:20px;
    	padding-right:20px;
    }
    Malheureusement, mon bloc #right passe sous le bloc #left au lieu de rester à côté. Que faire? Dans mon essai, ce bloc ne contient que du texte.

    Structure html:
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <body>
    	<header>
    	</header>
    	<div id="mainSection">
    		<div id="left">
    			div id="right">
    			</div>
    		</div>
    	</div>
    </body>

  2. #2
    Expert éminent sénior
    Avatar de ProgElecT
    Homme Profil pro
    Retraité
    Inscrit en
    Décembre 2004
    Messages
    6 096
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 68
    Localisation : France, Haute Savoie (Rhône Alpes)

    Informations professionnelles :
    Activité : Retraité
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Décembre 2004
    Messages : 6 096
    Points : 16 606
    Points
    16 606
    Par défaut
    Salut

    Peut être
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <body>
    	<header>
    	</header>
    	<div id="mainSection">
    		<div id="left">
    		</div>
    		<div id="right">
    		</div>
    	</div>
    </body>
    ligne 7 il te manque le < pour ta div id="right">
    pourquoi pas, pour remercier, un pour celui/ceux qui vous ont dépannés.
    saut de ligne
    OOOOOOOOO👉 → → Ma page perso sur DVP ← ← 👈

  3. #3
    Membre éclairé
    Homme Profil pro
    Ingénieur en électrotechnique retraité
    Inscrit en
    Décembre 2008
    Messages
    1 590
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 72
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Ingénieur en électrotechnique retraité

    Informations forums :
    Inscription : Décembre 2008
    Messages : 1 590
    Points : 813
    Points
    813
    Par défaut
    Merci tu as raison mais le problème n'était pas là car le chevron existe bien dans le code réel.
    J'ai trouvé mon erreur, il manquait display:grid;.
    Maintenant tout fonctionne.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [XL-2013] Difficultés pour la création d'une macro sur deux colonnes de nombres
    Par mr_hodor dans le forum Macros et VBA Excel
    Réponses: 8
    Dernier message: 08/07/2014, 12h49
  2. Barre de défilement dans une page avec deux colonnes
    Par padouk dans le forum Balisage (X)HTML et validation W3C
    Réponses: 9
    Dernier message: 17/07/2012, 03h21
  3. Numéroter une page sur deux
    Par lorenzo11 dans le forum Mise en forme
    Réponses: 23
    Dernier message: 27/08/2010, 17h00
  4. mise en page sur deux colonnes
    Par romanticide dans le forum Mise en forme
    Réponses: 1
    Dernier message: 30/10/2008, 09h17
  5. Ecrire une équation sur deux colonnes
    Par evincent dans le forum Mathématiques - Sciences
    Réponses: 1
    Dernier message: 22/03/2007, 07h55

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo