Entete fixed- section overflow

Fermé
jjaco Messages postés 529 Date d'inscription dimanche 20 janvier 2008 Statut Membre Dernière intervention 15 mars 2024 - 6 nov. 2013 à 19:42
jjaco Messages postés 529 Date d'inscription dimanche 20 janvier 2008 Statut Membre Dernière intervention 15 mars 2024 - 9 nov. 2013 à 14:04
Bonjour,

Bonjour,
comme je ne fais pas bcp de sites, je récupère des css ou html que j'ai déjà réalisé et je tombe sur un problème...
J'ai une page :
page{
background url:('fond.png');
}
j'ai aussi une entête qui est un table avec 1 <tr> et 3 <td> "inline-block"
et une zone section avec le contenu (article) + une zone aside à droite ou à gauche avec "position:relative;, là je tâtonne...ça va... Le problème il est que je fais fixed l'entête et que le texte du "corps" repasse en dessous . Comment faire pour que "entete et zone section soit séparé et que si je fais un overflow, il ne repasse pas en dessous. J'espère que quelqu'un a compris mon charabiat...
merci


1 réponse

Bonsoir,

que vous fassiez peu ou beaucoup de site il faut que vous compreniez ce que vous indiquez avec vos balise O.o

Déjà il y a deux erreurs en 2 ligne de codes:

page{// page doit être une id ou une class
background url:('fond.png');// n'existe pas
}

L'écriture correcte est :

.page{
background-image: url('fond.png');
}

Notez que fond.png doit bien sûr se trouver à la racine de votre site et que le css doit se faire appeler par l'attribut de balise HTML class sinon vous pouvez utiliser id mais il faut indiquer "#" en lieu et place de "." id étant unique dans une page class est plus répandu.

Pour l'attribut de classe position je vous conseille Google:
https://www.google.fr/search?q=css+position&ie=utf-8&oe=utf-8&rls=org.mozilla:fr:official&client=firefox-a&gws_rd=cr&ei=NtZ6UsWICrSg0wXj6YD4AQ

Idem pour fixed ce qui vous donnera une idée de ce que vous écrivez et donc de comment le modifier.

Il semble que le soucis soit qu'il faut revoir vos fondamentaux avant d'arriver à faire une mise en page.
0
Bon parce que je suit sympa :))

position:relative; indique la position d'un élément par rapport à son élément précédent dans le flux. Il faut donc indiquer une valeur correspondante à un décalage dans une direction.

.element{
position:relative;
top:-1em;
}

L'élément sera donc décalé de -1 hauteur de ligne(ou quadratin typographique) par rapport à sa position avec la balise qui la précéde et vers le haut.
Quand à fixed il ne sert pas à positionner mais à indiquer que la balise concernée est "fixe".
Il ne bougera pas lors d'un défilement de la page, ce qui est pratique en ergonomie pour avoir un menu(ou autre) qui va rester toujours à la même place.
Pour positionner un élément qui a la propriété fixed je vous recommande de le faire en position:absolute; qui indique une position qui est absolue par rapport aux bords de la page.
0
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 738
7 nov. 2013 à 01:09
j'ajouterais que pour le html la balise table n'est pas correct, <table> ne sert qu'aux données tabulaires et pas au positionnement

utilisez des <div> avec des float:left; ou display:inline-table; pour votre entete de site
0
jjaco Messages postés 529 Date d'inscription dimanche 20 janvier 2008 Statut Membre Dernière intervention 15 mars 2024 45
9 nov. 2013 à 14:04
excusez ma négligence mais dans ce message, j'ai écrit ce code un peu à la vavite... en réalité sur ma feuille css j'avais écrit
#page
{
background-image:url('img/fondp.png');
background-attachment:fixed;
width:90%;
margin:auto;
}
pour le reste,j'y suis occupé
merci de vos réponses, je reviendrai vous donner des nouvelles
0