Problème d'héritage dans une feuille de style

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par Leonick, 21 Décembre 2005.

  1. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 274
    J'aime reçus:
    0
    Bonjour,
    J'ai un problème sur cette page.
    http://www.df-informatique.com/photos-irlande/irlande
    Malgré le fait qu'elle soit valide xhtml strict (comme en html normal ça ne fonctionnait pas je l'ai passée en xhtml) et valide css, je n'arrive pas à obtenir ce que je veux.
    Je sais, les couleurs ne sont pas top :D mais ça me permet de vérifier plus facilement l'héritage.
    Je voudrais obtenir :
    des cadres fushia surmontés d'un h1 jaune et contenus dans un cadre rouge, lui-même contenu dans un body (blanc), lui même contenu dans le html (bleu).
    Or je n'obtiens ça ni avec FF, ni IE ni Opera.
     
  2. leffroyable
    leffroyable WRInaute occasionnel
    Inscrit:
    4 Décembre 2004
    Messages:
    447
    J'aime reçus:
    0
    J'ai déjà essayé de mettre des attribus de fond dans la balise html, mais ça n'a pas marché.
    Il vaut mieux utiliser la balise body en bleu, et faire une balise "#page" par exemple pour le blanc.

    Je ne sais pas s'il existe un moyen pour utiliser la balise html correctement
     
  3. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 274
    J'aime reçus:
    0
    Je sais que selon les navigateurs, certains reconnaissent html, d'autres body et d'autres les 2, d'où quelques confusions avec les fonds.
    Mais là, le gros problème vient surtout du div center (rouge) qui contient les
    tablo_cadre et donc autour de ces cadres, cela devrait être rouge. :cry:
     
  4. leffroyable
    leffroyable WRInaute occasionnel
    Inscrit:
    4 Décembre 2004
    Messages:
    447
    J'aime reçus:
    0
    je crois que le problème est lié au fait que les tablo_cadre sont en float: left
    tu as certes rajouté les caption avec clear: both mais en les mettant dans des span, je pense que ça ne peut pas marcher, il faudrait utiliser des div plutôt que span
     
  5. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 274
    J'aime reçus:
    0
    Visiblement oui, je viens de faire des tests en local et en enlevant float: left, le fond rouge se met bien derrière toutes les photos, par contre 1 seul cadre se trouve par ligne
    Si je mets un display:inline, ça ne change rien
    Non, je viens de tester, ça ne change rien.
     
  6. leffroyable
    leffroyable WRInaute occasionnel
    Inscrit:
    4 Décembre 2004
    Messages:
    447
    J'aime reçus:
    0
    juste avant de fermer la balise div center, il faut ajouter ce bloc :
    <div class="spacer">&nbsp;</div>
    en le définissant comme ça dans le css :
    .spacer{
    clear: both;
    height: 0;
    }

    ça devrait marcher
     
  7. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 274
    J'aime reçus:
    0
    Nickel, ça marche.
    Merci
    Bon, j'aurais voulu le faire sans hack (surtout pour FF), mais bon :wink:
    Initialement, j'avais un <p /> à la fin du div, mais ça ne le faisait pas.
     
Chargement...
Similar Threads - Problème héritage feuille Forum Date
Problème de htaccess chez Ionos URL Rewriting et .htaccess 12 Septembre 2022
Problème sur jquery avec fonction asynchrone Développement d'un site Web ou d'une appli mobile 6 Septembre 2022
Problème de crawl et d'indexation Crawl et indexation Google, sitemaps 1 Septembre 2022
WordPress Problème affichage style avec Elementor (titre, bordures, separateur) Administration d'un site Web 8 Août 2022
Problème d'indexation de backlinks Débuter en référencement 24 Juillet 2022
Problème d'indexation de backlinks Problèmes de référencement spécifiques à vos sites 21 Juillet 2022
Probleme de visibilité de ma page Facebook Facebook 5 Juillet 2022
problème avec le développeur Droit du web (juridique, fiscalité...) 22 Juin 2022
Problème désindexation des pages de Google Débuter en référencement 21 Juin 2022
Problème d'indexation de pages sur Google Problèmes de référencement spécifiques à vos sites 31 Mai 2022
problème de redirection non souhaitée Administration d'un site Web 28 Avril 2022
Problème d'indexation Produits Prestashop Crawl et indexation Google, sitemaps 28 Avril 2022
Problème d'affichage des campagnes Google Ads dans un tableau de bord Data Studio AdWords 26 Avril 2022
Problème de vitesse d'affichage des pages sur Analytics Google Analytics 26 Avril 2022
Problème : Google Crawl et Index des pages en No Index et bloqué par le robot.txt Crawl et indexation Google, sitemaps 26 Avril 2022
Problème avec GA4 : nb de visiteurs temps réel et par jour Google Analytics 19 Avril 2022
Problème indexation pages précises en React.js Débuter en référencement 19 Avril 2022
Problème de référencement Demandes d'avis et de conseils sur vos sites 8 Avril 2022
Problème adsence : Annonces ne s'affichent plus AdSense 10 Mars 2022
problèmes procédures stockées Administration d'un site Web 9 Mars 2022