Problème avec du CSS

Résolu/Fermé

Mouch89 Messages postés 109 Date d'inscription mercredi 6 janvier 2010 Statut Membre Dernière intervention 11 avril 2013 - 28 déc. 2010 à 20:51
notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 - 29 déc. 2010 à 11:07

Bonsoir,

Cela fait maintenant quelques heures que je cherche une solution à mon problème.
En fait, j'aimerais pouvoir agrandir une zone entre un entête et un pied de page fixes.
J'imagine que vous n'avez pas compris, mais je vois pas trop comment l'expliquer autrement (c'est peut être pour ça que j'ai rien trouvé sur Internet d'ailleurs :) )

Bref, voilà un petit schéma pour clarifier les choses :
https://www.imagup.com/data-recovery-solutions-for-small-businesses-of-san-francisco/

J'aimerais donc un fond fixe pour la tête et le pied de la page et un fond qui se répète en fonction de la taille de la page pour le corps.

J'ai bien pensé à découper mon bloc père en 3 blocs fixes, un pour l'entete, un pour le pied et un dernier pour le corps...
Mais comment définir les tailles ? Bref, je suis un peu perdu.

Merci beaucoup pour votre aide !

A voir également:

Problème avec du CSS
Enlever couleur lien css ✓ - Forum CSS
Mettre une image à gauche css ✓ - Forum CSS
Css exposant ✓ - Forum CSS
Déplacer une image css - Forum CSS
Css download - Télécharger - HTML

3 réponses

Réponse 1 / 3

notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 213
28 déc. 2010 à 21:15

Avec le code déjà réalisé, ce serait encore plus parlant..

Réponse 2 / 3

Mouch89 Messages postés 109 Date d'inscription mercredi 6 janvier 2010 Statut Membre Dernière intervention 11 avril 2013 7
28 déc. 2010 à 23:30

Merci LaurentJ, c'est exactement ça !

Je n'avais pas encore vu cette notion de position absolue.

notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 213
28 déc. 2010 à 23:35

J'avais très mal compris ta question. Je pensais que tu voulais parler d'images de fond. Bon.

C'est très très casse gueule le positionnement absolu... Cela demande une certaine maîtrise pour ne pas tomber dans certains pièges.
Vas voir du côté de ces gabarits : http://www.alsacreations.com/static/gabarits/

Mouch89 Messages postés 109 Date d'inscription mercredi 6 janvier 2010 Statut Membre Dernière intervention 11 avril 2013 7
29 déc. 2010 à 06:51

Oui, on m'a déjà suggéré ces gabarits.

Mais je préfère pas reprendre bêtement sur un modèle (aussi clair soit il), quitte à me casser la gueule sur le positionnement absolu...

C'est comme ça qu'on progresse non ? ;p

notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 213
29 déc. 2010 à 10:21

C'est pas faux ;)

Mouch89 Messages postés 109 Date d'inscription mercredi 6 janvier 2010 Statut Membre Dernière intervention 11 avril 2013 7
29 déc. 2010 à 10:28

En fait, je me compliquais la chose pour pas grand chose.
J'avais simplement à faire un bloc père constitué de 3 fils les uns en dessous des autres, celui du milieu (le contenu donc) ayant une taille variable et un fond qui se répète... Le tout sans utiliser une seule position absolue !

Bon, au moins maintenant je saurais à quoi me tenir quand on parlera de position absolue.

notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 213
29 déc. 2010 à 11:07

Hé, hé... Ben oui. :)

Réponse 3 / 3

LaurentJ
28 déc. 2010 à 21:30

Salut, si je comprend bien, tu cherches un truc du style

ton css

#general {
	position:absolute;
	width:900px;
	height:600px;
	margin-right: auto;
	margin-left: auto;
	left: 0px;
	right: 0px;
}
#head {
  position:absolute;
  width:900px;
  height:100px;
  top:0px;
  background-color:#000000;
}
#footer {
  position:absolute;
  width:900px;
  height:100px;
  bottom:0px;
  background-color:#0000FF;
}
#corps {
  position:absolute;
  width:400px;
  height:400px;
  margin-left:250px;
  top:100px;
  background-image:url(../images/tonimage.jpg);
  background-repeat:repeat-x;
}

ton body

<body>
<div id="general">
<div id="head"></div>
<div id="corps"></div>
<div id="footer"></div>
</div>
</body>

Dis moi si j'ai tout compris... ;)
ciaooo

Discussions similaires

[CSS] Forcé retour à la ligne

trait horizontal avec du css

HTML - définir taille bouton

[CSS] Mettre un objet au premier plan

Enlever le soulignement sous les liens en HTML/CSS

Discussions similaires

Newsletters