Soucis avec du code CSS sur HTML.

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Soucis avec du code CSS sur HTML.

snowden

Bonjour à tous,

Je le précise tout de suite, je n'y connais pas grand chose en programmation.

J'ai trouvé un script sur Github et j'essaie de le modifier à ma sauce.

Cependant, je rencontre un petit soucis de formatage.

Sauriez-vous comment je peux régler ce soucis svp ? Merci par avance.

Fenêtre en grand :

Fenêtre redimensionnée (plus on réduit la fenêtre de gauche à droite ou l'inverse et plus le cadre se réduit sur la gauche) :

Code CSS :

Code :

body {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
transition: background-color .2s;
background-color: var(--color0);
font-family:"2018";
color: var(--color15);
}
input,
button,
input:focus,
button:focus {
display: block;
box-sizing: border-box;
width: 100%;
margin: 0;
border: 0;
outline: 0;
background-color: transparent;
color: inherit;
font-family:"2018";
text-align: center;
-webkit-appearance: none;
-moz-appearance: none;
}
#clock {
display: block;
font-size: 7rem;
cursor: default;
border: 6px double #00a5ff;
width: 13%;
text-align: center;
font-family:"24";
}

Message édité par snowden le 09-07-2018 à 20:23:15

---------------
« A l’origine de toute erreur attribuée à l’ordinateur, vous trouverez au moins deux erreurs humaines. Dont celle consistant à attribuer l’erreur à l’ordinateur. »

Publicité

MaybeEijOrNot

but someone at least

Bonjour,

Sans le HTML c'est difficile de répondre avec certitude...
Néanmoins, l'élément #clock est déclaré avec une largeur (width) en pourcentage (vu le résultat obtenu, pourcentage proportionnel à la largeur de la fenêtre) alors que l'écriture à l'intérieur est fixe (font-size) quelque soit la largeur de la fenêtre.

Avec du contenu "non compressible", rien ne sert de travailler en pourcentage. Enlever la propriété "width" afin que l'élément occupe le minimum de place devrait régler le problème, puis jouer sur le "padding" pour éventuellement éloigner les bordures.

---------------
C'est en écrivant n'importe quoi qu'on devient n'importe qui.

snowden

Bonjour,

Merci pour ta réponse. Pour le HTML, j'aurais effectivement pu le montrer mais il est très long sans compter qu'il intègre beaucoup de code css et javascript.

Cependant, tu avais raison et ça a fonctionné. Voilà ce que j'ai fait et ça ne bouge plus

Code :

#clock {
display: block;
font-size: 7rem;
cursor: default;
border: 6px double #00a5ff;
padding: 0px 10px 0px 10px;
text-align: center;
font-family:"24";
}

Je te remercie encore pour ton aide.

---------------
« A l’origine de toute erreur attribuée à l’ordinateur, vous trouverez au moins deux erreurs humaines. Dont celle consistant à attribuer l’erreur à l’ordinateur. »

FORUM HardWare.fr

Programmation

HTML/CSS

Soucis avec du code CSS sur HTML.

Sujets relatifs
Code pour "tirage avec remise sans ordre"	[HTML/PHP/CSS] Diff de 2 données
forcer un code CSS sur une page web	Création base de données avec Entity code first
[Perl] Optimisation code perl CGI - Problème de performance	Code jeux du nombre aléatoire en python 3.6
[HTML] Formulaire fonctionnel sur navigateur mais bugué sur instagram.	Créer une sidebar verticale CSS only
Plus de sujets relatifs à : Soucis avec du code CSS sur HTML.

Page générée en 0.041 secondes