CONNEXION
  • RetourJeux
    • Sorties
    • Hit Parade
    • Les + populaires
    • Les + attendus
    • Soluces
    • Tous les Jeux
    • Gaming
  • RetourActu Gaming
    • News
    • Astuces
    • Tests
    • Previews
    • Toute l'actu gaming
  • RetourBons plans
    • Bons plans
    • Bons plans Smartphone
    • Bons plans Hardware
    • Bons plans Image et Son
    • Bons plans Amazon
    • Bons plans Cdiscount
    • Bons plans Decathlon
    • Bons plans Fnac
    • Tous les Bons plans
  • RetourJVTech
    • Actus High-Tech
    • Intelligence Artificielle
    • Smartphones
    • Mobilité urbaine
    • Hardware
    • Image et son
    • Tutoriels
    • Tests produits High-Tech
    • Guides d'achat High-Tech
    • JVTech
  • RetourCulture
    • Actus Culture
    • Culture
  • RetourVidéos
    • A la une
    • Gaming Live
    • Vidéos Tests
    • Vidéos Previews
    • Gameplay
    • Trailers
    • Chroniques
    • Replay Web TV
    • Toutes les vidéos
  • RetourForums
    • Hardware PC
    • PS5
    • Switch 2
    • Xbox Series
    • Switch
    • Pokemon pocket
    • FC 25 Ultimate Team
    • League of Legends
    • Tous les Forums
  • PC
  • PS5
  • Xbox Series
  • Switch 2
  • PS4
  • One
  • Switch
  • iOS
  • Android
  • MMO
  • RPG
  • FPS
En ce moment Genshin Impact Valhalla Breath of the wild Animal Crossing GTA 5 Red dead 2
Liste des sujets

Aide Html / CSS

Yassin6200
Yassin6200
Niveau 1
27 septembre 2020 à 22:39:41

J'ai besoin d'aide j'aimerais coller les images horizontalement meme sur deux ligne
Voici mon code : https://image.noelshack.com/fichiers/2020/39/7/1601239176-capture-d-ecran-2020-09-27-a-22-02-39.png

Nuagedecube
Nuagedecube
Niveau 24
28 septembre 2020 à 02:04:35

Il serait plus pratique, pour travailler le code, d'apprendre à mieux organiser les éléments car les paragraphes dépendent du <body> non pas d'un bloc prévu pour ce contenu.

Pseudo supprimé
Pseudo supprimé 28 septembre 2020 à 19:20:12

Pour t'aider à y avoir plus clair n'hésite pas à installer un IDE style VS Code, c'est pas obligatoire mais ça peut aider, bon la c'est du HTML donc pas trop de soucis quand même.

Sinon pour ce que tu veux faire, regarde du côté de Bootstrap.

mynameisflash
mynameisflash
Niveau 12
29 septembre 2020 à 14:59:19

J'ai pas compris "coller les images horizontalement meme sur deux ligne"

Yassin6200
Yassin6200
Niveau 1
29 septembre 2020 à 22:30:40

Le 29 septembre 2020 à 14:59:19 mynameisflash a écrit :
J'ai pas compris "coller les images horizontalement meme sur deux ligne"

Beh juste pouvoir avec les images cote à cote
Mais sur une ligne horizontale pas vertical comme sur mon screen

Marav
Marav
Niveau 47
30 septembre 2020 à 06:42:40

Réponse très courte et naïve : Met display:inline ou display:inline-block sur tes paragraphes ( <p> ) en CSS.

Plus de détails :
Tes paragraphes sont des blocks, donc prennent toute la largeur de ton conteneur, forçant donc le passage à la ligne suivante pour l'injection de ta prochaine image.
Pour bien comprendre le principe, essaye d'enlever un paragraphe entre deux images, tu verras !

Tu peux tout à fait écraser ce comportement par défaut comme je l'ai dit plus haut et n'hésite surtout pas à utiliser ton navigateur pour débugger ce genre de chose.

Si tu n'as pas tout à fait compris les termes que j'ai employé, il faut que tu te documentes sur le Modèle de Boite / Box-Model en HTML, la documentation MDN est d'une richesse inouïe là dessus.

https://developer.mozilla.org/fr/docs/Apprendre/CSS/Building_blocks/Le_modele_de_boite

PS : pourquoi j'ai dit courte et naïve, car si tu veux utiliser des solutions modernes il te faudra utiliser Flexbox et CSS Grid, mais ça demande déjà de bien comprendre ce que j'ai dit plus haut.

LornMalvo :d) Conseiller Bootstrap c'est so 2014 :noel: Nan sans rigoler en vrai, j'espère que les gens comprendrons que la Grid native de CSS est mille fois mieux. :oui:

Marav
Marav
Niveau 47
30 septembre 2020 à 06:46:56

Le 28 septembre 2020 à 02:04:35 Nuagedecube a écrit :
Il serait plus pratique, pour travailler le code, d'apprendre à mieux organiser les éléments car les paragraphes dépendent du <body> non pas d'un bloc prévu pour ce contenu.

Hein :question:
Je vois surtout qu'il a trop indenté au niveau de son body visiblement, et que y a une balise fermante qui s'est fait la malle à la ligne 28/29 c'est tout.

EDIT : je viens de comprendre ce que tu veux dire, je sais pas si c'est l'heure qui veut ça ou le fait que t'es pas allé droit au but. :noel:

Message édité le 30 septembre 2020 à 06:49:33 par Marav
Pseudo supprimé
Pseudo supprimé 30 septembre 2020 à 12:32:09

Le 30 septembre 2020 à 06:42:40 Marav a écrit :

LornMalvo :d) Conseiller Bootstrap c'est so 2014 :noel: Nan sans rigoler en vrai, j'espère que les gens comprendrons que la Grid native de CSS est mille fois mieux. :oui:

C'est pas faux .. Mais vu que j'aime beaucoup Bootstrap, je ne peux que le conseiller :gni:

Pseudo supprimé
Pseudo supprimé 30 septembre 2020 à 13:28:58

Le 30 septembre 2020 à 13:18:17 [Ludochette] a écrit :
Utiliser Bootstrap dans ce cas est une très mauvaise pratique.
L'utilisation abusive de librairies pour des choses aussi basiques est ce qui ruine la fluidité et la performance des sites de nos jours.

Sauf quand t'as pas le temps pour faire du front, les librairies sa te sauvent la vie.

Marav
Marav
Niveau 47
30 septembre 2020 à 21:52:37

[Ludochette] sauf que tu n'expliques pas vraiment son soucis et tu ne le résous pas. La sémantique je pense que ça passe après si il galère visiblement a placer ses images correctement.
La tu deplace le problème car t'avais envie de faire la morale j'ai l'impression.
Qu'il bosse le concept de modèle de boîte avant de le renvoyer sur flexbox ou quoi ..

Marav
Marav
Niveau 47
30 septembre 2020 à 23:55:27

Peut être une mauvaise interprétation de ma part oui, mea culpa. :(

Sous forums
  • Aide à l'achat Mac
  • Création de sites web
  • Création de Jeux
  • Linux
  • Programmation
  • Internet
  • Steam Deck
  • Macintosh
  • Hardware
La vidéo du moment