Aller au contenu

Sujets conseillés

Posté

Bonjours à tous,je viens d'arriver sur le forum et j'ai un petit soucis avec mon site.

Il y a un mois,j'ai décidé de faire un site internet de wallpaper bien que je ne connaissait aucun language utile à la conception d'une page internet.Pour le moment j'essaie de bien remplir mon site et après je verrais le design,le référencement,etc...

Mon problème,que je ne pense pas vraiment gros,et que,lorsque je diminu ma fenetre de mon site,mon corp passe en dessu de mon menu de droite en faite.

Mon site ici

Je pense qu'il y a un code pour figer les élémnts lorsque les page sont réduites ou agrandies.

Merci de votre aide et bone journée à tous... B)

Detrousseur

Posté (modifié)

Salut

/!\ Ce site peut mal s'afficher avec Firefox /!\
:mad2::lol:

En fait tu dois utiliser des valeurs en pourcentage au lieu de valeurs fixes ;)

#menu {
float: left;
margin: 10px;
width: 15%; /* largeur de 15% */
}
#menu2 {
width: 15%; /* largeur de 15% */
float: right;
margin: 10px;
}
#corps {
float: left;
width: 50%; /* largeur de 50%, pouvant se réduire */
text-align: center;
margin: 10px;
background-color: auto;
padding: 5px
}

Par contre cela finit toujours par bouger quand on réduit trop (enfin ça fonctionne largement en 800x600)...

Modifié par MS-DOS_1991
Posté

Salut MS-DOS_1991,

Merci de m'avoir repondu aussi vite.

Je ne comprend pas le système des pourcentage: pourquoi cela march avec les pourcentages et non avec les pixels ou juste ne mettant "auto"!!?? :unsure:

Tu m'a dis aussi:

Par contre cela finit toujours par bouger quand on réduit trop (enfin ça fonctionne largement en 800x600)... :unsure:

ce que je comprend,c'est que lorsqu'on est en 800x600 y'a pas de problème!?Mais la plupart des persone sont en 1024x748 alors ????

Posté

C'est encore moi...

J'ai fais ce que tu m'a dis mai sa ne change pas grand chose,si on rédui la page d'1/4 environ,sa recommence...

regarde cette adresse,et essaye de réduire ta fenetre la plus petite possible de manière à ce que tu puisse naviguer quand même: la page ne se déforme pas,rien ne bouge,on a juste les ascenceur qui apparaisse,et bien c'est à ça que je voudrais arriver.

Posté

Re

regarde cette adresse,et essaye de réduire ta fenetre la plus petite possible de manière à ce que tu puisse naviguer quand même: la page ne se déforme pas,rien ne bouge,on a juste les ascenceur qui apparaisse,et bien c'est à ça que je voudrais arriver.

pour info, la page que tu m'as donné est construite en tableaux, ce qui explique pourquoi elle ne se déforme pas ;)

ce que je comprend,c'est que lorsqu'on est en 800x600 y'a pas de problème!?Mais la plupart des persone sont en 1024x748 alors ????

Ce que je voulais dire par là, c'est que tu peux réduire ta page jusqu'à obtenir une page en résolution 800*600 sans que le menu de droite passe sous le contenu principal :wacko:

Mais la plupart des persone sont en 1024x748 alors ????

800x600 = ~70% des surfeurs

1024x768 = ~25% des surfeurs (données non vérifiées)

Pour un design fixe, met ceci:

#menu {
float: left;
margin: 10px;
width: 150px;
}
#menu2 {
width: 150px;
float: right;
margin: 10px;
}
#corps {
width: 1000px;
text-align: center;
margin-left: 150px;
background-color: auto;
padding: 5px;
}

Posté

Les règles du forum

Exprimez vous correctement: la langue usuelle du forum est le français, non le "chat" ou le "SMS". Les phrases telles que "keske jfé pour mon pécé?" n'inciteront pas à vous répondre. Gardez aussi à l'esprit qu'un futur employeur peut vous croiser ici... autant vous exprimer correctement et augmenter vos chances.

<_< <_<

Posté

Qu'est-ce que tu as mis comme doctype ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "DTD/xhtml1-strict.dtd">

devrait suffire à IE, non ?

Posté

Déjà, le site que tu donne en exemple, n'est pas extensible, c'est à dire que la taille du graphisme ne change pas en fonction de la taille de la fenêtre.

Personnelement je suis en 1280*1024 et la plupart des sites qui s'appuient sur les statisique et qui sont fixes (contrairement aux extensibles) me laissent une bonne portion d'espace inutilisé sur mon écran.

Donc je suis à fond pour les extensibles (c'est plus dur à faire, certes).

Je te propose 2 solutions, mais je trouve que celle de MS-DOS_1991 est la plus futée.

-tu met ton design complétement fixe:

Dans ta feuille de style ( index.css dans ton cas) à la partie body, met width: 1024px; au lieu de width: auto;

Pourquoi 1024 ?? Parce que c'est un des plus petites largeurs qui ne produisent pas le bug. j'y suis allé en tattonant donc peut être que tu trouvera moins, tu peux mettre une valeur plus grande sans problème, mais les visiteurs en dessous d'une certaine résolution auront un ascensseur horizontal, c'est pas très pratique :/

On a donc un design fixe, toujours la même taille: ceux qui sont sur un écran trop petit auront un ascensseur horizontal, les autres perdront un espace plus ou moins important selon leurs résolution.

Une autre solution est d'indiquer une taille minimum (là aussi 1024), quand la fenêtre sera réduite en dessous, au lieu d'obtenir le bug, on aura un ascensseur horizontal, mais attention, juste si la fenêtre est trop petite !! (donc les autres profiteront de tout leur écran).

On devrait donc avoir un design extensible.

Toujours dans la partie body de ta feuille de style, on supprime la ligne qui commence par "width" et on la remplace par "min-width: 1024px;".

Maintenant ceux qui ont une fenêtre assez grande auront un design extensible et les autres un scrollbar vertical. Ca parait la meilleur solution après les pourcentages seulement ....

Si tu teste bien, ça ne marche sur firefox mais pas sur internet explorer !!

Et oui, il connait pas "min-width", donc pour les utilisateurs d'Internet explorer, on va mettre une règle spéciale pour obtenir le résultat de ma première méthode:

* html body {
width: 1024px;
}

C'est un hack qui va faire que seul ie va lire cette commande.

J'éspère avoir été assez clair, je vois que tu débute mais je suis content que tu ais commencé par écrire des pages web en xhtml :)

Posté

Boo2M0rs0,je te remercie de m'avoir accordé un peu de ton temps à mon attention pour répondre à mes questions.Maintenant que ce problème là est réglé je vais pouvoir continuer ce site,qui j'espère,prendra une bonne place sur le web (c'est mon but).Ok,niveau design j'admet que pour le moment c'est pas top,mais j'attend que le site soit plus complet pour m'y attarder un peu plus, et pour ma police je vais la changer aussi vous inquiété pas.

Si vous avez des critiques ou des commentaires,ou même des conseils je les acceptent bien volontiers.

Bone soiré a tous et bon surfs... B)

Detrousseur

Posté

Je suis peut-être :offtopic: mais j'espère que vous ne m'en voudrez pas ...

Juste deux choses : je rejoins l'avis de Dudu (très savamment amené d'ailleurs !!!) concernant l'usage de la police sur ton site ... je trouve qu'il n'y a rien de moins professionnel que l'usage de la police Comic ... je suis sure que ton site gagnerait en crédibilité avec une police plus classique (style arial, verdana ....)

Autre chose ... J'ai remarqué que ton site était déja très riche en wallpapers ... mon seul bémol ... j'ai cru noter que certains wallpapers étaient estampillés par d'autres sites de fond d'écrans ... méfie-toi quand même du pompage intempestif, histoire de ne pas te faire eng**ler par d'autres webmasters ...

;-)

Posté

Wanbli, je te remercis du conseil...Pour la police je vais la changer très rapidement ne vous inquièté pas.

Pour les wallpapers,ce que j'ai remarqués,c'est que les sites de wallpapers du net ont tous les mêmes fonds d'écran,donc j'en ajoute d'autre que mon site soit plus complet.

Au début,j'avais pensé à signer tous mes wall en bas a droite mais après reflexions,j'ai remarqué la même choses sur certains autres sites,et je trouve que ton fonds d'écran perd sa classe donc j'ai préféré ne pas le faire...

Est-ce une bonne décision??Et niveau envirronement et design,est-ce que c'est pas trop primaire???

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...