28173 sujets

CSS et mise en forme, CSS3

hello...

voici le div contenu que j'utilise :

div#contenu
{
	margin:0px 0px;
	padding:0px;
	width: 768px ;
	text-align: left;
	color: #FF9933 ;
	border: 1px solid #0033FF;
}

comme vous pouvez le constater, je devrais avoir un bord de 1px autour de mon div.
voici mon code html

	<form  method="post" name="a_detail" id="a_detail" action="a_detail.php?pr=rs">	
<div id="contenu">
	<input type="hidden" name="h_idBien" id="h_idBien" value="113" />
		<h3 style="position: relative;">Bien &agrave; vendre r&eacute;f n&deg; 113&nbsp;<span class="prix">2000000&euro;</span> </h3>

		<div id="descbiendet">
				<br /><span class="titreBienList">hotel particulier de grrrrrrrrrrrrrrrand</span><br />
				<ul class="bienListDetail">
					<li>75008</li>
					<li>240&nbsp;m&sup2;</li>
					<li>8&nbsp;pi&egrave;ce(s)</li>	
					<li>0&nbsp;Chambre(s)</li>				
				</ul>

				<ul class="bienListDetail">
					<li style="width:175px;">3&egrave;me&nbsp;&eacute;tage</li>
					<li style="width:175px;">H.s.P&nbsp;:&nbsp;0&nbsp;m</li>
				</ul>
				<ul class="bienListDetail">

					<li style="width:175px;">Taxe fonci&egrave;re&nbsp;:&nbsp;300&nbsp;&euro;</li>	
					<li style="width:175px;">Charges/mois&nbsp;:&nbsp;230&nbsp;&euro;</li>				
				</ul>
				<br />
				<p>
					efziufhzehfhzlef				</p>

				<ul class="bienListDetailVu">
					<li>Terrasse</li><li>Ascenceur</li>				</ul>
				<ul id="photodet">
									</ul>
				<div id="IPE">
					<a href="javascript:window.print()">
						<img src="../image/printer.gif" alt="Imprimer cette fiche"  title="Imprimer cette fiche"/>&nbsp;

					</a>
					<img src="../image/cart_put.gif" style="height:18px;width:18px;" alt="Panier" title="Ajouter au panier"/>&nbsp;
					<img src="../image/email_go.gif"  alt="E-mail" title="Envoyer &agrave; un ami"/>&nbsp;
				</div>
		</div><!--descbienDet -->
		
		<dl id="bigPhoto">
					</dl>
	</div><!--contenu -->
	<br />

	<div class="navig">
					<a href="a_detail.php?pr=rs&Action=first&h_i=1">
				<img src="../image/b_firstpage.gif" alt="Premier"  title="Aller au d&eacute;but"/>
			</a> 
			<a  href="a_detail.php?pr=rs&Action=prev&h_i=1">
				<img src="../image/b_prevpage.gif" alt="Pr&eacute;c&eacute;dant"  title="Aller au Pr&eacute;c&eacute;dant"/>
			</a>
				Paris-Appartements
					<a href="a_detail.php?pr=rs&Action=next&h_i=1">
				<img src="../image/b_nextpage.gif" alt="Suivant"  title="Aller au suivant"/>

			</a> 
			<a  href="a_detail.php?pr=rs&Action=last&h_i=1">
				<img src="../image/b_lastpage.gif" alt="Dernier"  title="Aller au dernier"/>
			</a> 
			[#red]</form>[/#]
		<span style="text-align:right">
			<img src="../image/cart_edit.gif" height="18px"  width="18px" alt="Panier" title="Voir la s&eacute;lection du panier"/>
			<form  method="post" name="a_detail2" id="a_detail2" action="a_lbienmain.php?pr=rs&Action=retour">
				<input type="hidden" name="h_page" id="h_page" value="1"/>
				<input type="submit" class="StandardButton80" name="retour" value="Retour" />		
			</form>

		</span>
	</div><!--navig -->
</div><!--conteneur -->




mon site n'est aps encore en ligne, donc je peux rein vous montrer Smiley confus

le bord de ce div contenu s'affiche sur d'autre pages ou je l'utilise.
Le cadre s'affiche egalement lorsque je ferme ma balise div entre "</div><!--navig -->" et "</div><!--conteneur -->"....
Pourquoi???? mystere...si vous avez une idee.... Smiley cligne

merci d'avance....
Modifié par nath-0-0 (15 Feb 2006 - 17:17)
Préliminaire : sans page en ligne, c'est compliqué. À la rigueur, tu pourrais donner le code HTML + CSS entier, ce qui permettrait de reconstituer la page (mais ça demande un travail assez fastidieux à ceux qui voudraient t'aider, donc la page en ligne est la meilleure solution je pense). Sans reconstituer la page, ça reste possible de repérer une erreur, mais c'est plus compliqué. Avec une vraie page, par exemple, on peut repérer automatiquement certaines erreurs de syntaxe grâce à un validateur...

Première remarque : c'est moi qui lis mal ou alors tu as un form que tu ne fermes pas ? J'en vois bien un autre en bas, mais celui tout au début ?

Deuxièmement : as-tu des contenus flottés à l'intérieur de ta div#contenu ? Si oui, ça peut poser des problèmes. Cf beaucoup de messages dans ce forum (le forum sur les CSS principalement).

Troisièmement : tu as une liste de définition vide. Elle est censée servir à quelque chose ?
oui le form se ferme, sauf que peut etre qu'il n'est pas tres bien placé, vu qu'il se ferme avant le div dans le quel il est ouvert....oulalalalla suis je clair?
je vais t'indiquer ou il est en couleur...
Dans ma liste de definition il y'a normalement des photos,mais aucunes photos n'etait rattaché au bien dont j'ai copié le source....
Mais c'est sur que c'est pas la meilleur solution, faudra que je pense a changer cela...

Oui j'ai un float, la liste de definition est a un float....

Bonsi jamais je ressoumettrais mon probleme lorsque le site sera en ligne...
Bonjour,

nath-0-0 : le problème est qu'un code (X)HTML invalide, c'est un certaine dose d'incertitude (PDF, 407 Ko ) sur le rendu, très variable. Les erreurs peuvent n'avoir aucune conséquence dans un navigateur ou dans tous, comme elles peuvent en avoir d'essentielles.

Et le problème qui s'en-suit, c'est que les gens qui vont te répondre ont compris depuis longtemps que le test de validation préalable à tout problème de rendu faisait gagner un temps considérable, en levant cette incertitude.

Ce qui ne veut pas dire qu'il faut forcément présenter un code validé : un code invalide n'est pas problématique à partir du moment où son auteur a précisément mesuré les effets de cette invalidité, et peut poser sa question en connaissance de cause, avec éventuellement les précisions nécessaires. On peut se permettre d'être invalide quand on maîtrise parfaitement la validité.

Dans ton cas, tu ne sais pas trop si c'est valide ou non. Tu ne sais pas du tout ce que ça entraîne (moi non plus, tant que je n'ai pas regardé les choses en détail, ce que je n'ai pas le temps de faire ici, car je privilégie en toute logique les demandes reposant sur une validité maîtrisée : donc, je n'irais pas plus loin pour t'aider, et je ne suis (serai à l'avenir) pas le seul).

C'est pourquoi il faut retenir dans le cadre de ce forum au moins une règle : je pose une question après avoir vérifié la validité de ma structure (X)HTML et quand je suis capable d'expliquer le cas échéant "oui, c'est invalide, mais voilà pourquoi je ne peux pas faire autrement, et voilà les conséquences que j'ai pu vérifier".
Modifié par Laurent Denis (10 Feb 2006 - 12:46)
a laurent denis:

Bon ca va, si je maitrisais tout je ne viendrais pas sur ce forum...
Quant a maitriser la validité de ce que je fais, mon site n'est pas terminé, mon code n'est pas figé, j'essais de l'ameliorer sans cesse..
c'est le premier site que je developpe seule en devant me soucier de tout, je suis pas webdesigner mais informaticienne de gestion...
Alors non je n'ai pas compris depuis longutemps "que le test de validation préalable à tout problème de rendu faisait gagner un temps considérable".
Car la presentation de mon site n'est qu'une petite partie du site, meme si -je le conçois- c'est important.
xhtml-css, je ne maitrise pas, je ne sais pas de maniere certaine TOUS ce qui est valide ou pas, j'en sais de plus en plus mais pas TOUS.

Je fais des test,modifie ect...;donc j'ai testé en plaçant mon form de maniere plus logique et cela ne change rien de tout maniere...

Je n'ai pas tout lu donc je n'ai lu encore nulle part que
a écrit :
" je pose une question après avoir vérifié la validité de ma structure (X)HTML et quand je suis capable d'expliquer le cas échéant "oui, c'est invalide, mais voilà pourquoi je ne peux pas faire autrement, et voilà les conséquences que j'ai pu vérifier"."


Je peux pas deviner! En plus cela n'est pas mentionné dans le "a lire avant de poster"

Je ne sais pas quel ton tu as voulu mettre a ton post, mais moi je trouve qu'il est un peu sec, mais peut etre que j'y suis pas du tout, donc dans ce cas, je n'ai rien dit....

bon ceci dit j'ai trouvé ce qui posait probleme, c'est le float d'un de mes div comme me l'a suggerer mpop.
y'a t'il un moyen de contourner le probleme??
Bonjour !

a écrit :
c'est le float d'un de mes div


Le problème est que nous n'avons pas ta feuille de style complete (ni ta page XHTML d'ailleurs) : tu n'a mis le code CSS que d'une div sur les 3 ou 4 que j'ai pu apercevoir...
nath-0-0 a écrit :
Je ne sais pas quel ton tu as voulu mettre a ton post, mais moi je trouve qu'il est un peu sec, mais peut etre que j'y suis pas du tout, donc dans ce cas, je n'ai rien dit....

Laurent Denis est quelqu'un de très respectueux d'après mon expérience, et toujours disposé à apporter des éclaircissements... mais il pointe juste du doigt le fait – que malgré mon inexpérience par rapport à la sienne j'ai déjà pu observer – que répondre en détail à une demande d'aide mal formulée demande beaucoup de temps.

Certes, ça nous prendrait dix ou vingt minutes, tandis que la personne qui demande de l'aide planche parfois depuis des heures... mais dix ou vingt minutes multiplié par dix ou vingt appels à l'aide sur ces forums, et on finit par y passer sa journée. Donc, forcément, on répond plutôt aux questions bien formulées. Et une question bien formulée, ça peut être :
- un code plutôt valide (la validité en elle-même n'est pas indispensable, mais parfois ça permet de repérer une bête erreur de syntaxe !) ;
- une page html en ligne qui présente le problème à traiter.
Ensuite ça dépend de chaque cas, bien sûr.

Pour conclure : ça m'étonnerait que Laurent Denis ait voulu être sec ou hautain. Je ne le connais pas personnellement, mais ça n'a pas l'air d'être le genre de la maison Smiley cligne

nath-0-0 a écrit :
bon ceci dit j'ai trouvé ce qui posait probleme, c'est le float d'un de mes div comme me l'a suggerer mpop.
y'a t'il un moyen de contourner le probleme??

Bon, c'est un problème très courant. Je pense que je vais faire une page de test présentant le problème et la solution, comme ça je pourrai m'y référer lors des prochaines demandes. Donc réponse d'ici quelques temps.
Bon voilà, la réponse au problème du float est là :

http://web.covertprestige.info/test/03-elements-flottants-et-element-parent.html

C'est une version provisoire, il faudra que je la retravaille.
Edit : enrichi cette page de test avec une solution proposée par Laurent Denis (mais vite fait dans un message, donc je ne sais pas s'il faut généraliser cette solution à tous les cas...). Je ferai sans doute quelques tests la semaine prochaine (IE Mac et Win, Safari) pour voir.
Modifié par mpop (21 Feb 2006 - 19:33)
merci bcp, maintenant cela fonctionne, j'ai choisi la deuxieme solution.

Maintenant que je sais pour la validation, je vais le faire Smiley cligne .
Enfin mon code a bien été validé, mais cela fait deja un moment et vu que j'ai un peu avancé, j'ai pu ajouté des erreures!!!

Bon alors c'est moi qui ai mal pris la remarque de laurent denis....Pas toujours facile de faire passer les emotions ou de bien lezs interpreter,par ecran.... Smiley ohwell