28112 sujets

CSS et mise en forme, CSS3

Pages :
salut a tous,
voila j'ai réalisé un site avec le tuto d'el moutiko, www.team-propulsion.com
mais un ami sur mac m'a dit que ca ne passait pas, il n'avias pas tous les onglets du menu, et il y aait des deformations.
Que faire?
Merci
Salut
mac os 10.3.6 , avec safari 1.2.4, bref mon ibook tout à jour ca passe nikel.
Donc je connais pas sa config mais je pense qu'il est sous explorer et comme la version mac et encore plus merdique que la vesion pc, qu'elle n'est plus dévellopé sur notre plate forme, ca ne m'etonne pas.
Et puis si il est encore sous mac os 9 alors la je t'en parle même pas... Conseille lu d'upgrader et de passer sous firefox ou safari.
Mais oui ca passe nickel sur FireFox Mac et certainement sur Safari et aussi sur le nouveau navigateur Shiira
Sur firefox PC ton contenu foud le camp en dehors du cadre Smiley ohwell faudrait peut être voir à corriger aussi ça !
clear: both;
sur le pied de page est c'est réglé.
Ah juste une erreur mais c'est pas celle que tu citais. Le fond blanc est coupé par le fond bleu vers le premier tier de la page : capture d'ecran

upload/307-capture.jpg
Ben regarde la capture de supercanard, le fond blanc s'arrete pour laisser place a un fond bleu!
ptetre que je me trompe et ptetre que chui carrement a coté de la plaque mais voila
Hmm... je pige quedal à vos histoires de safari et je comprend pas trop le truc du background qui passe par dessus par dessous ...
wé mais dans mon tuto il n'y a pas le multi colonnage avec le positionement flottantet je crois bien que le problème vient de là, mais aparement non... enfin j'ai pas pigé l'histoire du background ...
ElMoustiko a écrit :
wé mais dans mon tuto il n'y a pas le multi colonnage avec le positionement flottantet je crois bien que le problème vient de là, mais aparement non... enfin j'ai pas pigé l'histoire du background ...

C'est quoi que tu appelles le multi colonnage? Smiley eek
@ ElMoustiko
Pour le multi colonnage, c'est que je ne voyais qu'une colonne structurée par des divs, bien que la restitution graphique en laisse paraître deux.

Je viens de refaire succintement le tuto de base et chez moi ça marche, certes pas sur Mac mais si quelq'un peut tester ce code sur Safari, je penses que cela devrait marcher comme le tuto de ElMoustiko.

Je ne vois pas où mais il doit y avoir un code mal former quelque part dans l'exemple du post initial, mais j'ai plus l'habitude des éléments en majuscule Smiley cligne . Il faudrait également reduire la largeur des éléments li du menu et la taille des caractères vu le nombre d'item du menu à mon avis.
upload/128-vroum0812200.png



HTML et CSS:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>
      Titre de page à changer
    </title>
    <meta http-equiv="Content-Type"
    content="text/html; charset=iso-8859-1" />
    <style type="text/css">

<!-- 
*{
  padding:0;
  margin:0;
}
body{
  text-align: center ;
  font: 1em 'Trebuchet MS', helvetica, sans-serif ;
  background: #214694 ;
}
p{
  margin:0 0 .8em 0;
}
#container{
  width:770px;
  margin:10px auto;
  border: solid 1px #fff;
  background:#fff;
  text-align:left;
}
h1#header{
  height:150px;
  background:#ccc;
}
#page{
  margin-left:100px;
  padding:1em;
}
ul#menu
    {
      height: 35px ;
      width:100%;
      margin: 0 ;
      padding: 0 ;
      background: #214694;
      list-style-type: none ;
    }
        
ul#menu li
    {
      float: left ;
      text-align: center ;
    }
    
ul#menu li a
    {
      width: 100px ;
      line-height: 35px ;
      font-size: 1em ;
      font-weight: bold ;
      color: #fff ;
      display: block ;
      text-decoration: none ;
      border-right: 2px solid #dea ;
      background:#214694;
    }
    
ul#menu li a:hover
    {
      background: url(bg_menu.gif) repeat-x 0 0 ;
    }
p#footer{
  clear:both;
  padding:1em;
  background:#ccc;
  margin:0;
} 
-->
    </style>
  </head>
  <body>
    <div id="container">
      <h1 id="header">
        Mon titre
      </h1>
      <ul id="menu">
        <li>
          <a href="news.php">News</a>
        </li>
        <li>
          <a href="pilotes.php">Les Pilotes</a>
        </li>
        <li>
          <a href="calendrier.php">Calendrier</a>
        </li>
        <li>
          <a href="resultats.php">Resultats</a>
        </li>
        <li>
          <a href="gallery.php">Photos</a>
        </li>
        <li>
          <a href="forum/index.php">Forum</a>
        </li>
        <li>
          <a href="contact.php">Contact</a>
        </li>
      </ul>
      <div id="page">
        <h2>
          Ut vitae mi
        </h2>
        <p>
          Lorem ipsum dolor sit amet, consectetuer adipiscing
          elit. Ut vitae mi. Praesent mollis quam non mauris.
          Suspendisse porttitor, diam at faucibus aliquam, turpis
          nisl suscipit felis, eleifend rhoncus pede lectus vel
          ligula. Proin eget velit. Vivamus gravida, mauris porta
          laoreet aliquet, mauris risus consequat metus, quis
          molestie risus tortor in odio. Suspendisse nunc.
          Suspendisse aliquet tempor metus. Phasellus nunc wisi,
          congue ut, accumsan et, scelerisque et, risus. Mauris
          blandit, lectus a vulputate ultricies, lorem risus
          dignissim augue, quis vulputate tortor arcu volutpat
          felis. Suspendisse interdum. Suspendisse bibendum, nisl
          id nonummy rutrum, urna neque pulvinar sem, at molestie
          augue dui vitae libero. Suspendisse potenti.
        </p>
      </div>
      <p id="footer">
        blabla copyright
      </p>
    </div>
  </body>
</html>
Bonjour,

Je me permets de rebondir à ce sujet, car je pense avoir le même problème que la personne qui a lancé le topic.

C'est-à-dire que cela fait 2 fois que le client nous appelle pour nous dire "je suis désolé mais le site ne marche pas".
Reseignement pris, ils sont sous IE MAC, OS10.
Le premier nous dit avoir une page blanche.
Le second nous a envoyé un impression écran où il manque bcp d'éléments, et je crois que ce sont tous les "background-image".

Le site surlequel j'aimerai débogger la chose rapidement:

www.dreamclic.com/monneron/accueil.php

Le client ne voit pas : les chevaux de la frise du haut et les boutons...
Donc forcément ça fait un peu restreint comme site.

Merci de me dire, si il faut vraiment abandonner IE MAC et le convertir à Firefix ou bien s'il a un bug connu et solutionné qqpart.

Merci.
Il faut abandonner IE et se convertir a Firefox, mais il y a toujours de personnes qui tournent avec mac os 9 donc avec netscape ou IE!
Ok Smiley smile

Merci...
Mais je crois que ça va être dur de dire aux clients

"Nous sommes passé au XHTML! C'est bcp mieux!! Mais ça ne marche plus avec votre navigateur préféré..."
johanna33 a écrit :

Le second nous a envoyé un impression écran où il manque bcp d'éléments, et je crois que ce sont tous les "background-image".


Pourtant cette propriété est réputée supportée par IE5 Mac. Je viens de vérifier dans Css précis et concis. Mystère. A tout hasard essayes d'appeler les images de background sans ' ou ".
Le problème c'est que je ne peux pas tester....

Si ce n'est pas les background, alors je ne vois pas du tout ce que ça peut être.

Etant donné que les chevaux de la frise supérieure sont appelées comme ça:

#header {
height:125px;
background:#000000 URL('images/chevaux1.jpg') top left no-repeat;
}

et

#graphicheader {
height:97px;
background:transparent URL('images/chevaux2.jpg') top right no-repeat;
}

et qu'ils ne s'affichent pas... je ne comprends pas quelle autre cause il peut y avoir.
Modifié le 10 Dec 2004 - 10:04
Pages :