Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11

CSS3 flex

9 réponses
Avatar
AlainL
Bonsoir,
J'essaie d'actualiser un site bricolé en 2000 et un peu de temps en
temps. Autant dire que je n'ai pas trop suivi l'évolution du HTML et
des CSS...
Je viens de découvrir à la fois les coins arrondis et flexbox.
J'ai donc, en pompant quelques bouts de scripts, "réussi" une ébauche de
page... mais je ne parviens pas à appliquer une classe à un élément
(baptisé section dans container)
Le code "section2 class="box" semble ne pas fonctionner et je ne gère
pas la couleur de fond des éléments
Un aperçu ici : http://autourdalos.fr/EssaisHerbier/page.php

Merci pour les conseils !

alainL

9 réponses

Avatar
Une Bévue
Le 05/02/2017 à 23:20, AlainL a écrit :
Le code "section2 class="box" semble ne pas fonctionner et je ne gère
pas la couleur de fond des éléments
Un aperçu ici : http://autourdalos.fr/EssaisHerbier/page.php

déja, étes vous sûr que "section2" ça existe comme tag ?
section je connais, mais section2 je n'ai jamais rencontré.
chez moi le résultat m'a l'air correct, enfin, correspondre au peu que
j'ai lu du css :
<http://www.cjoint.com/doc/17_02/GBgfCfB3CrX_EssaisHerbier.png>
Avatar
AlainL
Le 06/02/2017 à 06:28, Une Bévue a écrit :
Le 05/02/2017 à 23:20, AlainL a écrit :
Le code "section2 class="box" semble ne pas fonctionner et je ne gère
pas la couleur de fond des éléments
Un aperçu ici : http://autourdalos.fr/EssaisHerbier/page.php

déja, étes vous sûr que "section2" ça existe comme tag ?
section je connais, mais section2 je n'ai jamais rencontré.
chez moi le résultat m'a l'air correct, enfin, correspondre au peu que
j'ai lu du css :
<http://www.cjoint.com/doc/17_02/GBgfCfB3CrX_EssaisHerbier.png>

Bonjour
et merci. Je viens de supprimer "section2" et "section3" qui étaient
censés définir deux largeurs (pour la suite des opérations).
J'ai créé une class qui me permet de gérer la couleur du background.
J'ai aussi supprimé /**/ les "section:nth-of-type" dont je n'ai pas
compris la présence dans le script...
Pour l'instant, ça marche...
Bonne journée
alainL
Avatar
Eric Demeester
Bonjour,
AlainL (Sun, 5 Feb 2017 23:20:27 +0100 -
fr.comp.infosystemes.www.auteurs) :
Le code "section2 class="box" semble ne pas fonctionner et je ne gère
pas la couleur de fond des éléments
Un aperçu ici : http://autourdalos.fr/EssaisHerbier/page.php

En regardant la feuille de style, Il semble y avoir confusion entre
<div> (délimitation d'un bloc) et <section2> (classe).
Dans le html, je remplacerais :
<section2 class="box"> (qui n'a pas trop de sens...)
par :
<div class="box">
et j'ajouterais la largeur 48% à box dans la CSS :
.box {
padding: 5px;
width: 48%;
background-color: #ffffff;
border: 2px solid #000000;
border-radius: 10px;
}
Là, tu devrais avoir ton image de gauche sur fond blanc.
Si SAM passe par là, il corrigera si j'ai réconté des bêtises ;)
Merci pour les conseils !

HTH.
Avatar
docanski
AlainL a écrit le 05/02/17 à 23:20 :
Bonsoir,

Salut
Le code "section2 class="box" semble ne pas fonctionner et je ne gère
pas la couleur de fond des éléments

Le signe dièse devant "section2" devrait permettre d'utiliser cette
"section" comme identifiant (ID) et appliquer les styles qui la composent.
Cordialement,
--
docanski
Portail et annuaire du nord-Bretagne : http://armorance.free.fr/
Guide des champignons d'Europe : http://mycorance.free.fr/
La vallée de la Rance maritime : http://valderance.free.fr/
Les côtes du nord de la Bretagne : http://docarmor.free.fr/
Avatar
christian
Le Sun, 05 Feb 2017 23:20:27 +0100, AlainL a écrit :
Le code "section2 class="box" semble ne pas fonctionner et je ne gère
pas la couleur de fond des éléments Un aperçu ici :
http://autourdalos.fr/EssaisHerbier/page.php

section2 n'existe pas en html.
<section> existe en html 5
commence ta page par: <!DOCTYPE html>
pour déclarer ta page en html5
à partir de là, le code:
<section class="box"> blabla </section>
devrait fonctionner
(sauf sur les navigateurs obsolètes)
--
Christian
Avatar
AlainL
Le 06/02/2017 à 18:21, christian a écrit :
Le Sun, 05 Feb 2017 23:20:27 +0100, AlainL a écrit :
Le code "section2 class="box" semble ne pas fonctionner et je ne gère
pas la couleur de fond des éléments Un aperçu ici :
http://autourdalos.fr/EssaisHerbier/page.php

section2 n'existe pas en html.
<section> existe en html 5
commence ta page par: <!DOCTYPE html>
pour déclarer ta page en html5
à partir de là, le code:
<section class="box"> blabla </section>
devrait fonctionner
(sauf sur les navigateurs obsolètes)

Merci à tous. <section class:"box1"> ou "box2" ... ça marche. Pas mal ce
flex :-) !
Bonne soirée
alainL
Avatar
Une Bévue
Le 06/02/2017 à 22:17, AlainL a écrit :
Merci à tous. <section class:"box1"> ou "box2" ... ça marche. Pas mal ce
flex :-) !

grid c'est mieux, mais pas encore vraiment released...
Avatar
SAM
Le 05/02/17 à 23:20, AlainL a écrit :
Le code "section2 class="box" semble ne pas fonctionner et je ne gère
pas la couleur de fond des éléments
Un aperçu ici : http://autourdalos.fr/EssaisHerbier/page.php

ça semble fonctionner
- beigeasse pour les 1iers (ceux de gauche)
- blanc pour les autres (ceux de droite ici)
mon navigateur n'arrive pas à charger l'image
aconitum_lycoctonum_140909_01.jpg
et
il n'y a pas d'attribut 'alt' à cette image
Fx sur Mac et système obsolète
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Avatar
SAM
Le 06/02/17 à 06:28, Une Bévue a écrit :
Le 05/02/2017 à 23:20, AlainL a écrit :
Le code "section2 class="box" semble ne pas fonctionner et je ne gère
pas la couleur de fond des éléments
Un aperçu ici : http://autourdalos.fr/EssaisHerbier/page.php

déja, étes vous sûr que "section2" ça existe comme tag ?
section je connais, mais section2 je n'ai jamais rencontré.

ici ce n'est pas un "tag" mais i-un ID ...
alors
on y met bien ce qu'on veut ;-)
chez moi le résultat m'a l'air correct, enfin, correspondre au peu que
j'ai lu du css :
<http://www.cjoint.com/doc/17_02/GBgfCfB3CrX_EssaisHerbier.png>

Ha ?! toi tu as eu droit à l'image ?!?
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8