Page 1 sur 1

Espace entre 2 « div »

Publié : 13 déc. 2007, 23:04
par Québec
C'était trop dur... je n'ai pu résister... J'ai décidé de modifier quelque peu mon site wouèbe!

J'ai créé un « div » pour l'ensemble de la page, de façon à spécifier d'emblée les éléments de texte (taille, police...). Ensuite, j'ai créé un autre « div » pour un entête qui va contenir une image de fond et un titre (h1). Juste en dessous, je suis parvenu à faire un menu de navigation avec effet de « rollover » (yesss! Il est chouette!!!).

Mais KomPoZer sépare les deux blocs démesurément. J'aimerais bien que mes deux « boîtes » se touchent de façon à ce que la barre de menu vienne souligner en quelque sorte l'entête (image de fond + h1). J'ai fait des essais dans ma feuille CSS (variation de marge...), rien à faire, KompoZer garde un vaste espace entre les deux boites. Que faire?

Aussi, sur FireFox, ma barre de navigation est un peu plus large que mon entête quand pourtant, sur Kompozer, tout est ok.

Là encore, ya un truc qui m'a échappé...

Merci.

R.

Publié : 14 déc. 2007, 00:03
par Fabrice.Tres.Net
Si cela t'as échappé, nous on devrait pouvoir le voir dans ta page... encore faut-il que tu nous donnes son adresse ... ou à défaut son code, mais ce n'est pas le + pratique.
Prends pas froid!

Publié : 14 déc. 2007, 00:20
par Ymai
Bonjour
Ne serait-ce pas la même question que http://www.geckozone.org/forum/viewtopic.php?t=61239 ?

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.11) Gecko/20071127 Firefox/2.0.0.11

Publié : 14 déc. 2007, 04:30
par Québec
Effectivement, c'est le même genre de problème que dans le lien que tu pointes. J'ai fouillé sur ma page et ma feuille css pour tenter de trouver une réponse équivalente, mais j'ai encore rien vu... J'ai tenté de changer la hauteur de la ligne; j'ai éliminé le «div» qui faisait toute la page; j'ai surveillé pour des « margin-top » et autre trucs qui fabriquent de l'espace...

Je viens de faire un essai avec iCab, et c'est la même chose: il y a toujours cet espace qui refuse de disparaître. J'ai ce vague sentiment que ce n'est pas grand chose, et qu'il me pend au bout du nez... saloperie!

Je n'ai pas tout changé mon site encore, seulement la page suivante:
http://www.rguertin.com/geographie.html

Et puis, le gris va bientôt être remplacé par une image...

Merci.

R. Depuis son Québec enterré sous la neige (et dire qu'ils veulent nous faire croire que le climat se réchauffe...)

Publié : 14 déc. 2007, 07:33
par Fabrice.Tres.Net
Ton fichier css devrait débuter par :

Code : Tout sélectionner

/* Generated by KompoZer */
* {margin:0; padding:0;} // hack IE
body {
  font-family: Verdana;
  text-align: justify;
  font-size: small;
  margin-right: 1%;
}
#entete {
//  margin: 2%;  ligne à supprimer
  padding: 0;
  background-color: #999999;
}
Tu modifies le html comme suit:

Code : Tout sélectionner

 <body >
    <div id="entete">
      <h1>
        Géographie
      </h1>
    </div>
    <div id="navcontainer">
      <ul>
        <li>
          <a href="http://www.rguertin.com/index.html">accueil</a>
Cela devrait résoudre tes problèmes

Publié : 14 déc. 2007, 08:29
par chinon37
Québec a écrit :J'ai créé un « div » pour l'ensemble de la page, de façon à spécifier d'emblée les éléments de texte (taille, police...).
Inutile de créer un div.
Pour spécifier les styles applicables à la page entière, il suffit que tu crées une règle body, voire même html. cela créera un style qui sera automatiquement appliqué si aucun autre style ne vient le contredire en aval.

Publié : 16 déc. 2007, 04:23
par Québec
Merci. Tout baigne. Il reste quelques liens à faire fonctionner...

Ça tombe bien, parce que demain on nous annonce un autre 30cm de neige avec vents forts... On va rester bien au chaud demain!

R.

Publié : 16 déc. 2007, 09:47
par chinon37
Québec a écrit : Ça tombe bien, parce que demain on nous annonce un autre 30cm de neige avec vents forts... On va rester bien au chaud demain!
Quelques photos quand même?

Un petit détail qui m'ennuie sur ta nouvelle présentation (oui, je chipote, je chipote, pas taper)
Au niveau du bandeau d'en-tête, sur les écrans larges, on a un raccord à gauche: il s'agit de la répétition de l'image de fond. Et ça gène un peu l'esthétique de l'ensemble.
3 solutions peuvent pallier ce tout petit inconvénient:
- Faire une image de fond plus "panoramique" qui sera suffisamment large pour passer sur un maximum d'écrans. Mais sur les petits écrans, une partie de l'image ne sera pas visible.
- faire une image composée d'un certain nombre de petites images: la répétition choquera moins
- faire une entête à largeur fixe qui ne dépasse pas la taille maximum de l'image.

:wink:

Publié : 16 déc. 2007, 14:56
par Québec
Merci de l'observation. Ya tellement de trucs à penser... quand c'est pas un bout de code, c'est la présentation selon différents formats (IE, iCab, largeur d'écran...).

Pour ceux et celles qui cherchent une façon facile de faire des menus, j'ai trouvé:

http://css.maxdesign.com.au/ (en englais cependant; ya peut-être un meilleur endroit qu'ici pour l'annoncer?).

Sur mon serveur, dans mes stats, j'ai remarqué une erreur «404» (ou un truc du genre) concernant un document nommé: « robots.txt ». Je n'ai pas un tel document sur mon site mais vraisemblablement les moteurs de recherche le cherche. Ça correspond à quoi?

R.

Publié : 16 déc. 2007, 15:31
par Ymai
Bonjour
Voici un peu de lecture: http://docs.abondance.com/robots.html

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.11) Gecko/20071204 Ubuntu/7.10 (gutsy) Firefox/2.0.0.11

Neige

Publié : 23 déc. 2007, 16:34
par Québec
Pour chinon37: tu voulais des photos de tempête? J'en ai mis en ligne: une de la tempête et une autre de l'après-tempête... Et je vais en ajouter une troisième dans la journée. Mais photographier une tempête c pas évident... surtout pour le matériel!!!

Il ne reste qu'à mettre une image d'entête plus large pour les écrans (qui sont de plus en plus large!).

Joyeux Noël!!!

R.

Publié : 23 déc. 2007, 16:48
par jpbardiau
Québec a écrit :(en englais cependant; ya peut-être un meilleur endroit qu'ici pour l'annoncer?)
"englais" c'est du québécqois ? contraction de anglais et english :D

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.9b2) Gecko/2007121016 Firefox/3.0b2