28220 sujets

CSS et mise en forme, CSS3

Bonjour,
je ne sais pas si le problème vient du côté obscur des css mais le résultat vaut bien tous les commentaires que je peux faire ! : http://msiramy.free.fr/bak/ .
... sous Mozilla, le width spécifié pour le logo n'est pas pris en compte, de plus sous Internet les bordures de page sont décalées.
Sous Windows tous navigateurs confondus, les bordures sont décalées, sous Linux ça me donne l'image ci dessous :
upload/1321-Capture.png .

Pourquoi ce 'width' incontrolable ?
Le code est le suivant :
<div id="pied">
copyright Marc SIRAMY, année 2005 -
<p>
<a href="http://validator.w3.org/check?uri=referer"><img
src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0!" height="31" width="88" /></a>
</p>
</div>
-----------------------------------------------
#pied {
text-align : left;
padding:0.5em;
clear:both;
font-size:12px;
font-style: italic;
border-top : 1px solid black;
margin-top:15px;
}
#pied p
{
position:absolute;
display:block;
margin:0;
height=21px;
width=88px;
}
Je ne suis pas sur que le problème vienne de ce code, en fait le problème survient pour chaque image que je veux ajouter sur la page. Smiley rolleyes
Si vs voulez plus d'infos sur la css, elle se trouve ici : http://msiramy.free.fr/bak/styles/cadre.css .

Merci d'avance pour vos conseils. Smiley confused

Marco
Modifié par marco (20 Jun 2005 - 21:16)
Administrateur
Bonsoir Marco,

Ton code est malheureusement peu lisible.
Peux-tu - comme indiqué dans les règles - afficher tes exemples proprement grâce aux boutons de [ CODE] ? Merci d'éditer ton message Smiley cligne
Administrateur
Attention à l'écriture de tes déclarations CSS : le signe égal (=) n'a rien à faire là :
height=21px;
width=88px;


En CSS, c'est le double point (:) qui est utilisé.
Bonsoir Raphael,
la question du égal est résolue Smiley smile , la fatigue sans doutes.

Je ne peux être plus précis sur les exemples pour l'instant, les voici avec la balise code :



#pied {
	text-align : left;
	padding:0.5em;
	clear:both;
	font-size:12px;
	font-style: italic;
        border-top : 1px solid black;
	margin-top:15px;
      }
#pied p
{
//position:absolute;
//display:block;
margin:0;
height: 21px;
width: 88px;
}



<!-- Pied de page -->
  <div id="pied">
   	 copyright Marc SIRAMY, année 2005 - 
	<p>
      <a href="http://validator.w3.org/check?uri=referer"><img
          src="http://www.w3.org/Icons/valid-xhtml10"
          alt="Valid XHTML 1.0!" height="31" width="88" /></a>
	</p>
</div>


Marc
Administrateur
Il n'était pas nécessaire de reposter tes codes Smiley ohwell
Il suffisait d'éditer ton message précédent Smiley cligne
J'ai trouvé le bug, sans toutefois l'avoir compris : il se trouvait dans une autre css le code suivant, source du bug :


#a img
{
border: none ;
}

img 
{
	position:relative;
	border:none;
	margin:0;
	padding:0;
	width:750px;
}


Moralité de l'histoire : ne jamais laisser traîner ce genre de code mort comme je l'ai faits, sous peine de vous poser quelques questions métaphysiques.

Marco
Bonjour,

Cette autre déclaration css pour img spécifiait une dimension pour toute balise image présente que ne rectifiait pas la déclaration de ton id pied.

Tu devrais t'intéresser à la cascade et à l'héritage des propriétés css avec ce lien Comprendre la cascade (serveur pour le moment indisponible) et Cascade CSS et priorité des sélecteurs.

Puisque ton problème est réglé il ne te reste plus qu'à le mettre en résolu comme indiquée dans cette entrée de la faq: Comment éditer un sujet sur le forum, et comment classer un sujet en [Résolu] ? Smiley cligne
Merci Igor pour tes remarques pertinentes. Elles vont me permettre de combler quelques lacunes.

"Après tout, qu'est ce que la réalité ? Rien de plus qu'une intuition collective." [Lily Tomlin].
Ce forum y participe à sa manière. L'intuition collective, cela apporte beaucoup.

Marc
Modifié par marco (20 Jun 2005 - 21:15)