Centrer un cadre en CSS sur page HTML
astonvmax56
Messages postés
3
Date d'inscription
vendredi 13 septembre 2024
Statut
Membre
Dernière intervention
19 septembre 2024
-
Modifié le 17 sept. 2024 à 13:07
bg62 Messages postés 23664 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 17 décembre 2024 - 20 sept. 2024 à 17:02
bg62 Messages postés 23664 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 17 décembre 2024 - 20 sept. 2024 à 17:02
A voir également:
- Centrer un cadre en CSS sur page HTML
- Comment supprimer une page sur word - Guide
- Comment imprimer un tableau excel sur une seule page - Guide
- Comment faire un cadre sur word - Guide
- Editeur html - Télécharger - HTML
- Mettre google en page d'accueil - Guide
4 réponses
astonvmax56
Messages postés
3
Date d'inscription
vendredi 13 septembre 2024
Statut
Membre
Dernière intervention
19 septembre 2024
1
19 sept. 2024 à 16:18
19 sept. 2024 à 16:18
Bonjour,
ça fonctionne bien sur mon pc et aussi sur mon tél samsung,
j'avais essayer avec 80% mais je n'arrivai pas à centrer.
un grand merci,
Bruno83200_6929
Messages postés
282
Date d'inscription
jeudi 18 juin 2020
Statut
Membre
Dernière intervention
23 octobre 2024
57
17 sept. 2024 à 16:22
17 sept. 2024 à 16:22
Bonjour,
Pour y parvenir, il faut jouer avec les propriétés CSS telles que la largeur (width), le centrage via les marges, et un meilleur contrôle des bordures.
Voici une version modifiée de votre code HTML et CSS qui devrait vous permettre de centrer correctement le cadre sur la page :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 TRANSITIONAL//EN"> <!-- DATE DE CREATION: 01/07/2011 --> <HTML> <HEAD> <TITLE>ASTONVMAX</TITLE> <META NAME="Description" CONTENT="ASTONVMAX"> <META NAME="Keywords" CONTENT="ASTONVMAX"> <META NAME="Author" CONTENT="ASTONVMAX"> <META NAME="Generator" CONTENT="WebExpert"> <!-- CCS pour font speciale "" Arima-Madurai-Extra Bold "" sur la page web --> <link rel="stylesheet" type="text/css" href="fonts.css"> <link rel="stylesheet" type="text/css" href="cadres.css"> </HEAD> <BODY> <BR> <div class="border3"> <A HREF="http://www.auvergne.pref.gouv.fr/" TITLE="prefecture" TARGET="_blank">PREFECTURE</A> </div> <div class="border4"> <A HREF="https://ants.gouv.fr/" TITLE="documents sécurisés" TARGET="_blank">ANTS</A> </div> <BR> </BODY> </HTML>
.border3, .border4 { border-width: 2px; border-style: solid; border-color: #000000; padding: 10px; /* Ajustement de la taille des marges internes */ background-color: #80FFFF; width: 80%; /* Le cadre prend 80% de la largeur de la page */ margin: 10px auto; /* 'auto' centre l'élément horizontalement */ text-align: center; /* Centrage du texte à l'intérieur du cadre */ }
Avec ces ajustements, vos cadres .border3 et .border4 devraient être correctement centrés, tout en occupant 80% de la largeur de la page.
astonvmax56
Messages postés
3
Date d'inscription
vendredi 13 septembre 2024
Statut
Membre
Dernière intervention
19 septembre 2024
1
18 sept. 2024 à 08:45
18 sept. 2024 à 08:45
bonjour et merci,
je vais essayer votre solution et vous tiendrai au courant,
bg62
Messages postés
23664
Date d'inscription
samedi 22 octobre 2005
Statut
Modérateur
Dernière intervention
17 décembre 2024
2 392
20 sept. 2024 à 17:02
20 sept. 2024 à 17:02
une solution universelle :
https://www.w3.org/Style/Examples/007/center
:)