[Résolu]Problème avec le header

Bonjour tout le monde !

Je travaille sur un site pour une entreprise.
Après avoir enfin réglé le problème de mes couleurs dans le menu, puis après des modifications pour la mise en forme, les titres,... il me reste une question à vous poser :

Actuellement, j'ai mis un background dans le header. Quand je visite la page en pleine écran, tout va bien. Par contre, si je redimensionne ma fenêtre Internet, le header va se cacher sous la colonne du menu. J'aimerais savoir s'il n'y aurai pas une étape que j'aurais loupé.

voici le CSS :

.haut {
width: auto;
height: 170px;
color: #000;
font-size: 1px;
padding: 10px;
background-image: url(Logosansframe1.jpg);
background-repeat:no-repeat;
background-position:center;
margin-left: 240px;
}
.conteneur {
height: 338px;
width: 100%;
}
.gauche {
position: absolute;
left: 0;
width: 240px;
height: 338px;
background-image: none;
}
.frame {
margin-left: 260px; /* on place ce bloc à droite du bloc menu de 240px de large */
width: auto;
height: auto;
overflow: auto; /* cette propriété va permettre le scroll de ce bloc */
font-size: 14px;
color: #fff;
font-size: 18px;
}
.bas {
width: auto;
height: 30px;
background-color: #000;
color: #fff;
font-size: 12px;
padding: 10px;
text-align: center;
}

#fixElement {
position: absolute;
top: 126px;
left:0px;
}
#mainContent {
height: 100%;
overflow: auto;
}
html {
height: 100%;
}
-->

/* MISE EN FORME DES TITRES */

<!-- 
div#mainContent h1 {
	text-align: center;
	font-size: 2em;
	color: #fff ;
	font-weight: bold;
}

div#mainContent h2 {
	margin-left: 10px ;
	line-height: 35px;
	padding-left: 25px ;
	font-size: 2em;
	font-weight: bold;
	background: url(Puce2.jpg) no-repeat left ;
	color: red ;
	border-bottom: 1px solid red ;
}

div#mainContent h3 {
	margin-left: 40px ;
	padding-left: 5px ;
	font-size: 1.4em;
	color: #ccc ;
	border-left: 3px solid #ccc;
}

div#mainContent h4 {
	text-align: center;
	font-size: 2em;
	font-weight: normal;
	color: #f4db4a ;
}

div#mainContent h5 {
	margin-left: 10px ;
	padding-left: 25px ;
	font-size: 1.8em;
	font-weight: lighter;
	background: url(Puce2.jpg) no-repeat left ;
	color: #F4DB4A ;
	border-bottom: 1px solid #f4db4a ;
}

div#mainContent h6 {
	
}
-->

/* MENU DISPOSITIONS */
/* CSS issu des tutoriels css.alsacreations.com */

<!-- 
body {
margin: 0;
padding: 0;
background: #000;
font: 100% arial, Helvetica, sans-serif;
position: absolute;
width: 100%;
height: 100%;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
top: 0;
left: 0;
}
#menu {
width: 15em;
}
#menu dt {
cursor: pointer;
margin: 2px 0;
height: 20px;
line-height: 20px;
text-align: center;
font-weight: bold;
border: 1px solid black;
background: #ccc;
}
#menu dd {
border: 1px solid black;
}
#menu li {
text-align: left;
background: #000;
}

#menu dt a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}
#menu li a {
color: #fff;
font-size: 100%;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}
#menu dt a:hover {
background: #ffff66;
}

#menu dt:hover {
background: #ffff66;
}

#menu li a:hover { 
background: #cc9900;
}

.mentions {
font-family: Arial, Helvetica, sans-serif;
position: absolute;
top : 200px;
left : 10px;
color: #000;
background-color: #ddd;
}

et le le site concerné

Vous remerciant par avance,

Ashka
Modifié par Ashka (07 Feb 2007 - 09:39)

Je me permets un petit up, au cas où

Euh, s'il vous plaît? Une aide serait la bienvenue.
Merci

Bonsoir,
je n'ais pas regardé ton code, mais j'ai vu ton site...Au secours...T'es tu aperçu que ton background du header et plus large que ton "head"? Résultat, il manque une partie de ton image; de plus celle ci est beaucoup trop lourde (105ko!!!!!!?????? )
Question couleur: le noir de ta page n'est pas le même que celui de ton "head"...mauvaise idée.
Je sais, ça ne répond pas à ta question...mais voilà déjà du boulot, non?
Tchô

Salut,
je dois avouer que je n'ai pas regardé ton code ...
Mais essaie ce lien...
Modifié par hyoga (04 Feb 2007 - 20:07)

Boro64 -->
Concernant la largeur (ou plutôt longueur non?) de mon head c'est justement là que ca me pose problème, vu qu'il se cache sous un morceau noir.

[EDIT]C'est tout bon, il ne se cache plus le coquin. Sa position est moche, mais bon, au moins on le voit en entier quand on redimensionne les fenêtres.

Concernant la couleur, c'est normal vu que c'est le logo de la boîte et que oui il a des couleurs très moches mais je suis obligée de le garder ainsi... Le noir du site est pour un meilleur rendu des photos des produits (produits lumineux nécessitant un fond noir pour mieux ressortir...).
Concernant la taille de l'image je vais la retravaillée t'inquiètes pas ^^ c'est juste un site d'essai et non le définitif. Il était prévu de diminuer le poids!
En tout cas merci pour ta réponse.

Hyoga--> Merci aussi pour ta réponse ! Je vais de ce pas aller voir ce que me dit de beau ton lien !

[EDIT]J'ai lu mais sans y trouver une aide pour le header, mais bon c'est réglé pour le moment!

Et je ne vous en veux pas de ne pas avoir lu le code, faut dire qu'il est un peu longuet... Et en plus je viens de le modifier...
Modifié par Ashka (05 Feb 2007 - 14:51)

Désolée pour ce nouveau post, mais j'avais besoin d'un ouvrir un autre pour poser une dernière question (après je vous embête plus ).

Maintenant que ce probleme de background est réglé (du moins, il me semble...), j'aimerais savoir si cela est possible:
que mon background reste en position centré tel que le texte dans la frame. Parce que là il est centré mais sur toute la longueur de la page.
Si je mets un margin le background va se cacher derrière dès que l'on redimensionne la fenêtre.

Voilà voilà, en espérant avoir un ch'tit coup de pouce de votre part.

Merci d'avance.

(si il n'y a pas de solution, me le dire de suite que je puisse mettre [Résolu] et que je n'attende pas pour rien)