Deux tableaux différents sur un site perso

Salut,

Un truc dans ce genre :

<div style="width:100%; position: relative;">
  <table style="position: absolute; left:0;"></table>
  <table  style="position: absolute; right:0;"></table>
</div>

Bonjour,

“comment je peux déplacer les tableaux”
je n'ai pas bien compris.

Alors, j'ai fabriqué cet exemple où j'ai inséré 6 tableaux.

J'ai utilisé une feuille de styles pour pouvoir les placer exactement où je le voulais avec un positionnement en absolute.

Un tableau a été gardé en position:relative pour qu'il pousse le dernier paragraphe vers le bas du conteneur et qu'il le force ainsi à s'adapter au contenu.

À tester.

++
Est-ce que ce n'est pas un peu trop compliqué pour toi ?

--

salut, merci pour ta réponse pour mes tableaux,enfaite j'ai compris comment ca marche, mais ia 2 codes que faudrait que tu m'explique:
ta mit "<table id="t4" border="0" cellpadding="2" cellspacing="0">", id j'ai compri mais border, cellpadding et cellspacing, pas trop, tu pourrais m'expliquer à koi ils servent?
Aussi, dans conteneur, pq tu met background-color, alors que juste apres, tu met une image sur background?
Quelle est la différence entre position:absolut et relative?
Tu commence par style et tu met "html, body", pq tu met "html" est ce que c obligé de le mettre ou on peut mettre seulmenet body?
Que signifie font-weight?
et une derniere, tu met à la fin "<p> *avec un code au milieu* </p>", qu'est-ce que ca signifie?
Ooo zut, mnt je me rend compte que j'ai posé tro de question?. Mais si tu pourrais me répondre, ca serait génial, je te remercie d'avance.

Tu pourrais répondre à toute ces question en cherchent sur le net.

C'est vrai que beaucoup de tes questions peuvent trouver facilement des réponses.

— <table id="t4" border="0" cellpadding="2" cellspacing="0">

— dans conteneur, pq tu met background-color, alors que juste apres, tu met une image sur background
L'image, un dégradé, que tu sembles aussi utiliser, fait 800px de haut.
Ce dégradé va d'un gris à du blanc.
Si le conteneur a besoin de faire plus de 800px de haut, alors le blanc du dégradé se fondra avec le fond blanc (#fff) du conteneur.

— la différence entre position:absolute et relative
la différence entre position:absolute et relative
la différence entre position:absolute et relative
la différence entre position:absolute et relative

— [ tu met "html, body", pq tu met "html" est ce que c obligé]
Non, ce n'est pas obligatoire.
Je ne me souviens plus de mes sources, mais il me semble qu'IE a parfois besoin qu'on lui précise les choses.
html sert à ça, à partir de 0.

— font-weight

— "<p> *avec un code au milieu* </p>"
C'est pour le dernier tableau ne colle pas au bas du conteneur.
Un <p></p> vide est à éviter, je l'ai rempli d'un espace (&nbsp;).

++
Évite le sms…

Merci pour toutes les infos, une derniere question qui me perturbe vraiment, les pages que je crée, ne sont pas affichés de la meme facon sur Mozilla que sur IE, un example:

MOZILLA:
http://img64.imageshack.us/img64/7559/firefoxaf5.jpg

IE:
http://img231.imageshack.us/img231/479/iedb7.jpg

Est-ce qu'il y a une solution, car beaucoup de gens que je connais utilisent IE, et il y a aussi beaucoup d'autre gens qui utilisent Mozilla?

Il y a certainement des solutions.
Elles ont certainement déjà été évoquées dans ce forum.

Mais il nous est difficile de proposer des corrections à partir d'images.

Tu as pu analyser mon code. Nous ne pouvons pas en faire autant du tien.
Du code est indispensable, une adresse est mieux.

--

Ok, je vais essayer de t'envoyer le code.

https://www.118712.fr/sortir.html
Voila, mon site, mais la page CSS, est séparé de la page html. Si t'en a besoin envoie ton adresse mail, je vais t'envoyer le fichier.

Essaye le site sur IE et Mozilla tu verras qu'il y a une différence.

T'as trouvé des fautes alors?

C'est bon, j'ai trouvé mon probleme, mes "<div>" étaient mal positionnés.
Merci pour l'aide Gihef.

Je ne vois pas où est le problème entre ces deux navigateur, ce n'est pas identique mais il n'y a pas de problème. Un site identique sur tous les navigateurs ça n'existe pas.

Enfaite, j'avais mal positionnés mes blocs, et il y a des choses qui marchent pas sur FF, et d'autre qui ne marchent pas sur IE.
C'était mon cas, mais maintenant j'ai bien placé mes tableaux, et j'ai appris à le faire ici, sur ce forum, merci encore.

Pour les images de sous-titre, je les mettrais dans les tableaux (il faudra qu'elles soient plus petites) dans un <td> avec colspan.

Ton image de fond est un fond régulier.
Tu n'as pas besoin de nous faire charger tous ces ko.
Fais comme dans mon exemple. 4px de large + répétée suffit :

background : url(ax.jpg) 0 0 repeat-x;

Forte semble plutôt être une fantasy.
Elle ne s'affiche pas chez moi.
Arial, Verdana ne sont pas des serif;

Attention aux dimensions.
Je ne les ai pas calculées, mais il est fort probable que les width + les margin + les padding dépassent les dimensions des blocs contenant les autres.

La “<h2 class="titre">” n'est pas nécessaire.
Le stylle défini pour le h2 suffirait.

Quel est l'intérêt de #conteneur ?

Pour les blocs de résultats, je mettrais en œuvre un autre positionnement, le float.

  #resultats {	
  /*position:absolute;
  top:150px;*/
  float : left;
    width:550px;
    height:1000px;
    border:4px double black;
    padding: 10px 20px 0 20px;
    }
  #resultats2 {	
  /*position:absolute;
  left:620px;*/
  float : left;
    width:550px;
    height:1000px;
    border:4px double black;
    padding: 10px 20px 0 20px;
    }

Ça devrait résoudre le problème d'alignement.
Je l'ai essayé dans cet exemple.
J'ai repris ta page dans cet exemple.

À tester.

D'autres modif. apporteraient certainement un peu plus de netteté au code.

++
Si tu en as la possibilité, choisis-toi tout de suite une autre solution d'hébergement.
Voila peut sembler pratique, mais on trouve mieux, plus simple à gérer.
Par exemple, https://subscribe.free.fr/accesgratuit/

Salut, merci d'avoir corrigé mes fautes.
Déjà, je voulais te demander pour hébérger mon site chez "Free", je ne vois pas où il faut que je click, parce que si je click sur "Inscrivez-vous",je crois que je m'inscris pour l'internet, téléphonie et tout ca. Dis moi où est ce qu'il faut que je click.
Ensuite,regarde ce que j'ai changé dans ma page:
https://www.118712.fr/sortir.html

Pour cette image de font, enfaite j'ai mit une image, car je voulais qu'il y est un degradé en bas et en haut, et comme je connais seulement repeat-x, pour le haut, j'ai crée une image.

C'est vrai, pour le <h2> j'ai merdé, j'ai remarqué il y a pas longtemps que ce n'était pas nécessair de mettre "class".

Pour l'instant, je laisse le conteneur, j'ai essayé de l'enlever et il y a un pas ma de chose qui était modifié, je verrai apres, car là je suis mort. :)
Pour la police, FORTE, est une police qui était avec le WINDOWS dans le répertoir c:\WINDOWS\Fonts.
J'ai démandé à mes amis, ca marche chez eux, et enfaite je ne comprend pas trop ce que "serif" veut dire.

Les dimensions, c'est vrai que j'ai pas calculé, mais bon, je verrai apres, comme pour le conteneur.

Si tu as le temps, corrige stp, les erreurs de mes changement.

Merci, et raconte comment faire pour etre hébergé chez Free. :) mErCi

J'espere que je te soul pas trop :)

Pour free.
Tu t'inscris. Tu ne demandes même pas le kit de connexion.
Donne des infos réelles. Ils vont t'envoyer un courrier postal de confirmation avec tout ce dont tu auras besoin (id, mot de passe, adresses…). À conserver.
Tu n'es pas obligé d'utiliser leur connexion pour te connecter chez eux. Tu gardes ton FAI.

Pour les familles de polices.
Forte n'est certainement disponible que sur Windows. Les autres ne la voient pas.
Chez moi, c'est l'alternative suivante qui s'affiche, Arial.
Essaye ça

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Un titre</title>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <style type="text/css">
    html, body {
      margin: 0;
      padding: 0;
      text-align: center;
      color : #fff;
      }
    #contener { 
      width:780px; 
      text-align : center;
      background-color : #aaa;
      } 
    #contenu { 
      width:500px; 
      margin: 0 auto; 
      background-color : #eee;
      font-size : 130%;
      } 
    p {
      margin:10px;
      height:30px;
      line-height:30px;
      background-color:#555; 
      }
  </style>
</head>
<body>
  <div id="contener"> 
    <div id="contenu">
    <p style="font-family:serif; text-align:left;">serif - 123</p>
    <p style="font-family:Georgia, serif;">Georgia - 123</p>
    <p style="font-family:'Times New roman', serif;">Times New roman - 123</p>
    
    <p style="font-family:sans-serif; text-align:left;">sans-serif - 123</p>
    <p style="font-family:Arial, sans-serif;">Arial - 123</p>
    <p style="font-family:Verdana, sans-serif;">Verdana - 123</p>
    
    <p style="font-family:sans-serif; text-align:left;">fantasy - 123</p>
    <p style="font-family:Papyrus, fantasy;">Papyrus - 123</p>
    <p style="font-family:'Comic Sans MS', fantasy;">Comic Sans MS - 123</p>
    
    <p style="font-family:monospace; text-align:left;">monospace - 123</p>
    <p style="font-family:Courier, monospace;">Courier - 123</p>
    <p style="font-family:'Andale Mono', monospace;">Andale Mono - 123</p>
    </div> 
  </div>
</body>
</html>

Tu remarques des différences ?
Et vois http://www.yoyodesign.org/doc/w3c/css2/fonts.html#generic-font-families

Pour l'image de fond.
Le dégradé peut être obtenu comme je te le décrivais.
C'est ce que j'ai utilisé dans l'exemple (5 ko plutôt que 235) où je n'ai gardé que 4 px de large de ton image et où je la fais se répèter horizontalement (en x).

Tu pourrais faire

#classement1:hover, #classement2:hover, #classement3:hover, #classement4:hover, #classement5:hover, etc. {
  background-image:url(fondlien2.jpg);
  }

ou mieux, puisque tout ça c'est la même chose, tu pourrais n'utiliser qu'une class

.btn_classement:hover {
  background-image:url(fondlien2.jpg);
  text-align : center;
  }

pour tous

   <div class="btn_classement"><a href="https://www.goal.com/fr/">Classement</a></div>

--

Merci pour ta réponse, pour free, je me suis inscrit, tu ne sais pas combien de temps je dois attendre le courrier je me suis inscrit ce matin??

Pour les polices, j'ai toujours pas compris:-(
Si tu pouvais juste m'expliquer en quelques mots, la différence entre serif, sans-serif, fantasy, monospace. Bon pour fantasy je crois que j'ai compris. Mais ton explication m'aiderait beaucoup.

Pour l'image de font, enfaite je pense que j'ai mal expliqué.
Dans ton example, tu met ton image en haut et tu le fais répeter et ca fait que dans la page, il y a du gris en haut, et ca devient blanc,en dégradé koi.
Moi ce que je veux c'est que ca fasse:
GRIS
BLANC
GRIS

et tout ca en dégradé, mé je sais pas comment je peux mettre une petite image pour qu'elle se répete en bas, c'est ca le probleme.

Et pour les hovers, merci pour le conseil c'est pratique.

A suivre, :)++

J'ai supprimé #conteneur
c'est vrai qu'il ne servait à rien