probleme barre sous header - Forum PHP / MySQL

La Communauté Webmaster

  Forum-webmaster
  Technique - programmation
  PHP / MySQL (Modérateurs: Shain, Jey, erwinol, Lilian, lauryv, ToToMaStEr)
  probleme barre sous header

« Précédent Suivant »

Pages: [1]

Descendre

Répondre

Aviser des réponses

Envoyer le sujet

Imprimer

Auteur

Sujet: probleme barre sous header (Lu 5126 fois)

probleme barre sous header
« sur: le 12-02-2011 a 00:54:32 »

damb341
Membre récent

Hors-Ligne

Sexe: Male

Male

Messages: 23

Voir le Profil

E-Mail

Répondre avec citation

Bonjour,

Etant débutant dans le monde du php, je vous explique mon problème qui a mon avis est bête comme chou.

J'ai créé une page index.php et un header.html. Le probleme est qu'entre mon header et le contenu j'ai un espace et je ne vois pas comment l'enlever. Pourquoi? me direz vous. Tout simplement parce que j'ai une couleur qui va de la barre de menu à mon footer. Or la j'ai un espace entre, comme sur l'image:

Uploaded with ImageShack.us

Je peux fournir mon code si cela peut aider.

En remerciant que vous aider un newbie

Rapporter au modérateur

Parce qu'un forum c'est comme une école, on apprend par des grands, et quand nous devenons grand, nous aidons les plus petits.

Re:probleme barre sous header
« Répondre #1 sur: le 12-02-2011 a 08:10:32 »

Ether Création
Habitué

Hors-Ligne

Messages: 390

Voir le Profil

WWW

E-Mail

Répondre avec citation

Bonjour,

Le plus simple pour vous venir en aide serez que vous nous envoyé votre page intégré + votre code.

Cordialement

Arthur

Rapporter au modérateur

Agence de création de site internet
Tél : 02.85.52.07.81
Fax : 09.72.14.99.88
contact@ethercreation.com
http://www.ethercreation.com
Siret: 511 736 167 000 20

Re:probleme barre sous header
« Répondre #2 sur: le 12-02-2011 a 13:26:16 »

damb341
Membre récent

Hors-Ligne

Sexe: Male

Male

Messages: 23

Voir le Profil

E-Mail

Répondre avec citation

la page : http://www.dba-prod.com/index.php.

Le code du header.html :
<div id="recherche">
<table width="984" border="0">
<tr>
<td> </td>
<td width="139px" height="29px"> </td>
<td width="24px" height="29px"> </td>
</tr>
</table>
</div>
<div id="bandeau"></div>
<div id="menu">
<a href="index.html"><div class="menu accueil-in"></div></a>
<a href="lasociete.html"><div class="menu societe"></div></a>
<a href="prestations.html"><div class="menu prestations"></div></a>
<a href="podcast.html"><div class="menu podcast"></div></a>
<a href="livredor.html"><div class="menu livredor"></div></a>
<a href="contact.php"><div class="menu contact"></div></a>
<a href="mentionslegales.html"><div class="menu mentionslegales"></div></a>
<a href="partenaires.html"><div class="menu partenaires"></div></a>
</div>
<div id="ligne"></div>
----

la page index.php :

<!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" xml:lang="fr" lang="fr">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DBA PRODUCTION FILMS</title>
<link rel="SHORTCUT ICON" href="http://dba-prod.com/favicon.ico" type="image/x-icon" />
<link rel="icon" type="image/png" href="/images/favicon.png" />
<link rel="shortcut icon" href="favicon.ico" />
<link href="style-site.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
   <script type="text/javascript" src="js/jquery.featureList-1.0.0.js"></script>
<div id="header">
<div id="entete">
<?php include('header.html'); ?>
</div>
</div>
</head>

<body>
<style type="text/css">

      h3 {
         margin: 0;
         padding: 7px 0 0 0;
         font-size: 16px;
         text-transform: uppercase;
      }

      div#feature_list {
   width: 955px;
   height: 240px;
   overflow: hidden;
   position: relative;
      }

      div#feature_list ul {
         position: absolute;
         top: 0;
         list-style: none;
         padding: 0;
         margin: 0;
      }

      ul#tabs {
         left: 0;
         z-index: 2;
         width: 320px;
      }

      ul#tabs li {
         font-size: 12px;
         font-family: Arial;
      }

      ul#tabs li img {
         padding: 5px;
         border: none;
         float: left;
         margin: 10px 10px 0 0;
      }

      ul#tabs li a {
         color: #222;
         text-decoration: none;
         display: block;
         padding: 10px;
         height: 60px;
         outline: none;
      }

      ul#tabs li a:hover {
         text-decoration: underline;
      }

      ul#tabs li a.current {
         background: url('jquery/feature-tab-current.png');
         color: #FFF;
      }

      ul#tabs li a.current:hover {
         text-decoration: none;
         cursor: pointer;
      }

      ul#output {
         right: 0;
         width: 646px;
         height: 240px;
         position: relative;
      }

      ul#output li {
         position: absolute;
         width: 646px;
         height: 240px;
      }

      ul#output li a {
         position: absolute;
         bottom: 10px;
         right: 10px;
         padding: 8px 12px;
         text-decoration: none;
         font-size: 11px;
         color: #FFF;
         background: #000;
         -moz-border-radius: 5px;
      }

      ul#output li a:hover {
         background: #29aac9;
      }
   </style>
   <script language="javascript">
      $(document).ready(function() {

         $.featureList(
            $("#tabs li a"),
            $("#output li"), {
               start_item   :   1
            }
         );

         /*

         // Alternative


         $('#tabs li a').featureList({
            output         :   '#output li',
            start_item      :   1
         });

         */

      });
   </script>
<div id="page">

<div id="jquery">
            <div id="feature_list">
         <ul id="tabs">
            <li>
               <a href="javascript:;">
                  <img src="jquery/services.png" />
                  <h3>Podcast</h3>
                  <span>Comment créer une arche à ballons</span>
               </a>
            </li>
            <li>
               <a href="javascript:;">
                  <img src="jquery/programming.png" />
                  <h3>cinema</h3>
                  <span>Programme de février 2011</span>
               </a>
            </li>
            <li>
               <a href="javascript:;">
                  <img src="jquery/applications.png" />
                  <h3>facebook</h3>
                  <span>Pourquoi facebook vaut cher?</span>
               </a>
            </li>
         </ul>
         <ul id="output">
            <li>
               <img src="jquery/sample1.jpg" />
               <a href="#">Découvrez la vidéo</a>
            </li>
            <li>
               <img src="jquery/sample2.jpg" />
               <a href="#">voir le programme</a>
            </li>
            <li>
               <img src="jquery/sample3.jpg" />
               <a href="#">lire l'article</a>
            </li>
         </ul>

      </div>
   </div>

<div id="menu_carre">
<table width="984" border="0">
<tr>
<td colspan="9" height="18px"></td>
</tr>
<tr>
<td> </td>
<td ><img src="images/carre_1.png" width="228" height="147" /></td>
<td> </td>
<td><img src="images/carre_2.png" width="228" height="147" /></td>
<td> </td>
<td><img src="images/carre_3.png" width="228" height="147" /></td>
<td> </td>
<td><img src="images/carre_4.png" width="227" height="147" /></td>
<td> </td>
</tr>
<tr>
   <td colspan="9" height="44px"></td>
</table>
</div>
<div id="pied">Content for id "pied" Goes Here</div>
Content for id "page" Goes Here</div>
</body>
</html>

Rapporter au modérateur

Parce qu'un forum c'est comme une école, on apprend par des grands, et quand nous devenons grand, nous aidons les plus petits.

Re:probleme barre sous header
« Répondre #3 sur: le 12-02-2011 a 13:26:35 »

damb341
Membre récent

Hors-Ligne

Sexe: Male

Male

Messages: 23

Voir le Profil

E-Mail

Répondre avec citation

le stule-site.css :

#search {
   background-image:url(images/bg_head.png);
   background-repeat:repeat-x;
}

#recherche {
   font-family: "Segoe UI";
   background-image: url(images/bg_head.png);
   background-repeat: repeat-x;
   margin: 0px;
   padding: 0px;
   height: 33px;
}
#bandeau {
   background-image: url(images/banniere_logo.png);
   background-repeat: no-repeat;
   margin: 0px;
   padding: 0px;
   height: 139px;
   width: 984px;
}

#page {
   background-color: #FFF;
   background-image: url(images/bg.jpg);
   background-repeat: repeat;
   padding: 0px;
   width: 984px;
   margin-top: 0px;
   margin-right: auto;
   margin-bottom: 0px;
   margin-left: auto;
}

#header {
   background-color: #FFF;
   background-image: url(images/bg.jpg);
   background-repeat: repeat;
   padding: 0px;
   width: 984px;
   margin-top: 0px;
   margin-right: auto;
   margin-bottom: 0px;
   margin-left: auto;
}

#titre{
   margin-top: 10px;
}

#menu_carre {
   height: 165px;
   width: 984px;
   background-color: #E2E2E2;
}

#menu {
   background-color: #E2E2E2;
   height: 38px;
   width: 984px;
}
#jquery {
   height: 240px;
   width: 955px;
   margin-top: 19px;
   background-color: #E2E2E2;
   margin-right: 14.5px;
   margin-left: 14.5px;
   background-image: url(images/fond_jquery.png);
   background-repeat: repeat;
}

body
{
   font-size:13px;
   font-family:Arial, Helvetica, sans-serif;
   background-color:#f2f2f2;
   width:984px;
   margin:auto;
   margin-top:25px;
}

/* Barre de menu */

.menu
{
   width:98px;
   height:38px;
   display:inline-block;
   background-image:url(images/menu.png);
   background-repeat: no-repeat;
   margin-right:-4px;
}

.accueil {width: 98px; background-position: 0 top;}
.societe {width: 108px; background-position: -98px top;}
.prestations {width: 146px; background-position: -206px top;}
.podcast {width: 97px; background-position: -352px top;}
.livredor {width: 105px; background-position: -449px top;}
.contact {width: 110px; background-position: -554px top;}
.mentionslegales {width: 157px; background-position: -664px top;}
.partenaires {width: 162px; background-position: -821px top;}

.accueil:hover {width: 98px; background-position: 0 -40px;}
.societe:hover {width: 108px; background-position: -98px -40px;}
.prestations:hover {width: 146px; background-position: -206px -40px;}
.podcast:hover {width: 97px; background-position: -352px -40px;}
.livredor:hover {width: 105px; background-position: -449px -40px;}
.contact:hover {width: 110px; background-position: -554px -40px;}
.mentionslegales:hover {width: 157px; background-position: -664px -40px;}
.partenaires:hover {width: 162px; background-position: -821px -40px;}

.accueil-in {width: 98px; background-position: 0 -80px;}
.societe-in {width: 108px; background-position: -98px -80px;}
.prestations-in {width: 146px; background-position: -206px -80px;}
.podcast-in {width: 97px; background-position: -352px -80px;}
.livredor-in {width: 105px; background-position: -449px -80px;}
.contact-in {width: 110px; background-position: -554px -80px;}
.mentionslegales-in {width: 157px; background-position: -664px -80px;}
.partenaires-in {width: 162px; background-position: -821px -80px;}
#formulaire {
   font-family: "Segoe UI";
   font-size: 12px;
}

#main-container{
   width:400px;
   margin:30px auto;
}

td{
   white-space:nowrap;
}

a, a:visited {
   color:#00BBFF;
   text-decoration:none;
   outline:none;
}

a:hover{
   text-decoration:underline;
}

h1{
   color:#777777;
   font-size:22px;
   font-weight:normal;
   text-transform:uppercase;
   margin-bottom:5px;
}

h2{
   font-weight:normal;
   font-size:10px;

   text-transform:uppercase;

   color:#aaaaaa;
   margin-bottom:15px;

   border-bottom:1px solid #eeeeee;
   margin-bottom:15px;
   padding-bottom:10px;
}

label{
   text-transform:uppercase;
   font-size:10px;
   font-family:Tahoma,Arial,Sans-serif;
}

textarea{
   color:#404040;
   font-family:Arial,Helvetica,sans-serif;
   font-size:12px;
}

td > button{
   text-indent:8px;
}

.error{
   background-color:#AB0000;
   color:white;
   font-size:10px;
   font-weight:bold;
   margin-top:10px;
   padding:10px;
   text-transform:uppercase;
   width:240px;
}

#loading{
   position:relative;
   bottom:9px;
   visibility:hidden;
}

.clear{
   clear:both;
}

#form-container{
   background-color:#f5f5f5;
   padding:15px;

   -moz-border-radius:12px;
   -khtml-border-radius: 12px;
   -webkit-border-radius: 12px;
   border-radius:12px;
}

#adresse{
   width:800px;
   margin:30px auto;
}

#adressepostale{
   background-color:#f5f5f5;
   padding:15px;

   -moz-border-radius:12px;
   -khtml-border-radius: 12px;
   -webkit-border-radius: 12px;
   border-radius:12px;
}

#pied {
   background-image: url(images/bg_foot.png);
   height: 184px;
   width: 962px;
   background-repeat: no-repeat;
   margin-top: 43px;
   margin-right: 11px;
   margin-bottom: 14px;
   margin-left: 11px;
   padding: 0px;
}

merci beaucoup de m'aider

Rapporter au modérateur

Parce qu'un forum c'est comme une école, on apprend par des grands, et quand nous devenons grand, nous aidons les plus petits.

Re:probleme barre sous header
« Répondre #4 sur: le 12-02-2011 a 14:19:43 »

Ether Création
Habitué

Hors-Ligne

Messages: 390

Voir le Profil

WWW

E-Mail

Répondre avec citation

Bonjour,

Alors tout d'abord ca :
<div id="header">
<div id="entete">
<?php include('header.html'); ?>
</div>
</div>

Il faut le mettre juste après le <body> et non pas dans le head.
Ensuite pour le soucis de marge, c'est dans le css voici l'endroit
Ligne 63 dans votre fichier style-site.css ou #jquery
Il faut enlever le margin-top.

Cordialement

Arthur

Rapporter au modérateur

Agence de création de site internet
Tél : 02.85.52.07.81
Fax : 09.72.14.99.88
contact@ethercreation.com
http://www.ethercreation.com
Siret: 511 736 167 000 20

Re:probleme barre sous header
« Répondre #5 sur: le 12-02-2011 a 19:42:38 »

damb341
Membre récent

Hors-Ligne

Sexe: Male

Male

Messages: 23

Voir le Profil

E-Mail

Répondre avec citation

merci beaucoup, mais je me suis mal exprimé. Le but est d'avoir la meme page que http://dba-prod.com/index.html. En en supprimant le margin top, effectivement la page se colle bien au menu, sauf qu'à la base, la ligne blanche est sencé etre coloré en gris, comme le fond gauche droite du site. désolé encore

Rapporter au modérateur

Parce qu'un forum c'est comme une école, on apprend par des grands, et quand nous devenons grand, nous aidons les plus petits.

Re:probleme barre sous header
« Répondre #6 sur: le 12-02-2011 a 19:51:54 »

Ether Création
Habitué

Hors-Ligne

Messages: 390

Voir le Profil

WWW

E-Mail

Répondre avec citation

Dans ce cas remplacer le margin-top, par un padding-top !

Rapporter au modérateur

Agence de création de site internet
Tél : 02.85.52.07.81
Fax : 09.72.14.99.88
contact@ethercreation.com
http://www.ethercreation.com
Siret: 511 736 167 000 20

Re:probleme barre sous header
« Répondre #7 sur: le 12-02-2011 a 19:53:50 »

damb341
Membre récent

Hors-Ligne

Sexe: Male

Male

Messages: 23

Voir le Profil

E-Mail

Répondre avec citation

je sais que je suis chiant, sur les cotés effectivement c'est devenu gris, mais sur le jquery ca reste blanc. Mystere et boule de gum :s

Rapporter au modérateur

Parce qu'un forum c'est comme une école, on apprend par des grands, et quand nous devenons grand, nous aidons les plus petits.

Re:probleme barre sous header
« Répondre #8 sur: le 12-02-2011 a 19:55:08 »

Ether Création
Habitué

Hors-Ligne

Messages: 390

Voir le Profil

WWW

E-Mail

Répondre avec citation

oui a cause du background.
Donc la solution est de créer un div intermédiaire!

Rapporter au modérateur

Agence de création de site internet
Tél : 02.85.52.07.81
Fax : 09.72.14.99.88
contact@ethercreation.com
http://www.ethercreation.com
Siret: 511 736 167 000 20

Re:probleme barre sous header
« Répondre #9 sur: le 12-02-2011 a 19:59:56 »

damb341
Membre récent

Hors-Ligne

Sexe: Male

Male

Messages: 23

Voir le Profil

E-Mail

Répondre avec citation

oui c'est ce que je viens de me dire, que j'avais pas mis de blanc a part en fond du jquery.

Merci beaucoup a toi de prendre le temps d'aider les nuls comme moi

Merci

Rapporter au modérateur

Parce qu'un forum c'est comme une école, on apprend par des grands, et quand nous devenons grand, nous aidons les plus petits.

Re:probleme barre sous header
« Répondre #10 sur: le 12-02-2011 a 21:23:54 »

damb341
Membre récent

Hors-Ligne

Sexe: Male

Male

Messages: 23

Voir le Profil

E-Mail

Répondre avec citation

J'aurais voulu te demander, a moins que cela t'embete, comment en php, je peux faire cela : utiliser le meme header pour toutes mes pages (jusque la pas compliqué^^) mais faire mon onmouseover et garder selectionner la deuxieme image quand je suis sur la page (en occurence, garder le mot "accueil" selectionner sur la page accueil, prestation, quand je suis sur la page prestation)...

Rapporter au modérateur

Parce qu'un forum c'est comme une école, on apprend par des grands, et quand nous devenons grand, nous aidons les plus petits.

Re:probleme barre sous header
« Répondre #11 sur: le 14-02-2011 a 08:46:29 »

Ether Création
Habitué

Hors-Ligne

Messages: 390

Voir le Profil

WWW

E-Mail

Répondre avec citation

En php tu créer une variable comme = $menu ou tu met avant d'appeler ton include.
Ensuite dans ton include, tu fais des conditions en fonction de ton menu.

Rapporter au modérateur

Agence de création de site internet
Tél : 02.85.52.07.81
Fax : 09.72.14.99.88
contact@ethercreation.com
http://www.ethercreation.com
Siret: 511 736 167 000 20

Re:probleme barre sous header
« Répondre #12 sur: le 14-02-2011 a 11:24:04 »

damb341
Membre récent

Hors-Ligne

Sexe: Male

Male

Messages: 23

Voir le Profil

E-Mail

Répondre avec citation

Je suis désolé, mais je ne comprends pas trop. Enfin j'imagine qu'il faut utiliser "if" et tout, mais comme dit précédemment je suis novice. Je sais que je t'embete beaucoup

Rapporter au modérateur

Parce qu'un forum c'est comme une école, on apprend par des grands, et quand nous devenons grand, nous aidons les plus petits.

Re:probleme barre sous header
« Répondre #13 sur: le 14-02-2011 a 11:28:00 »

Ether Création
Habitué

Hors-Ligne

Messages: 390

Voir le Profil

WWW

E-Mail

Répondre avec citation

En effet le plus simple serait que j'ai accès à votre code (ftp) pour que je puisse vous faire la modifications

Rapporter au modérateur

Agence de création de site internet
Tél : 02.85.52.07.81
Fax : 09.72.14.99.88
contact@ethercreation.com
http://www.ethercreation.com
Siret: 511 736 167 000 20

Re:probleme barre sous header
« Répondre #14 sur: le 14-02-2011 a 11:46:22 »

damb341
Membre récent

Hors-Ligne

Sexe: Male

Male

Messages: 23

Voir le Profil

E-Mail

Répondre avec citation

je t'ai envoyé tout ca en privé. En tout cas, merci beaucoup de ton aide . J'imagine le temps que cela représente

Rapporter au modérateur

Parce qu'un forum c'est comme une école, on apprend par des grands, et quand nous devenons grand, nous aidons les plus petits.

Répondre

Aviser des réponses

Envoyer le sujet

Imprimer

Pages: [1]

Monter

« Précédent Suivant »

Sauter à:

Votre statut : Invité

Vous devez être membre pour participer.

Let’s Encrypt : le certificat SSL gratuit

Tester votre site internet sur différents navigateurs

[WordPress] Des problèmes avec l’administration ?

Rappel : Mettez à jour vos CMS et vos sites E-commerce

Le .fr fête ses 25 années d’existence !

Mesurer votre audience en temps réel avec BubbleStat

Porter réclamation contre Google Panda ?

Zlio n’est plus …

Forum ecommerce

Hebergement Professionnel

Copyright (c) Devclic 2002 - 2026 - Tous droits réservés

creation site internet strasbourg