Gerer les diminutions de pages
Fermé
dourlens59
Messages postés
65
Date d'inscription
vendredi 24 mai 2013
Statut
Membre
Dernière intervention
24 janvier 2017
-
22 juin 2013 à 19:13
cubeur78 Messages postés 98 Date d'inscription mercredi 10 novembre 2010 Statut Membre Dernière intervention 23 août 2013 - 23 juin 2013 à 16:44
cubeur78 Messages postés 98 Date d'inscription mercredi 10 novembre 2010 Statut Membre Dernière intervention 23 août 2013 - 23 juin 2013 à 16:44
A voir également:
- Gerer les diminutions de pages
- Gerer les profils netflix - Guide
- Supprimer des pages sur word - Guide
- Comment numéroter les pages sur word - Guide
- Comment restaurer les pages google - Guide
- Gerer foyer netflix - Accueil - Guide streaming
6 réponses
Dur de deviner sans voir le code :s
Le problème peut venir des dimensions des éléments de votre page. Vous devez le faire en taille relative(pourcentage) pour qu'elle s'adapte à toutes les tailles(ratio longueur/largeur) et résolutions d'écran.
>Y'a t'il un style CSS qui permet de fixer des "<div>"
Que voulez vous dire? Vos div se déplacent ils?
En html et avec CSS les éléments sont positionnés à la suite sauf si on veut les sortir du flux. Il y a 2 types de comportements pour les balises: inline et block. Inline (en ligne) va remplir l'espace restant sauf si l'espae est insuffisant. Block ira à la suite en utilisant sa propre ligne.
Quand un élément est fixé (fixed en CSS) il l'est par rapport à la page et l'on peut scroller la page il restera à la plae où il est fixé(donc toujours présent où que l'on soit dans la page); cela permet d'avoir par exemple un élément de navigation mais je ne pense pas que c'est ceci que vous voulez.
Le problème peut venir des dimensions des éléments de votre page. Vous devez le faire en taille relative(pourcentage) pour qu'elle s'adapte à toutes les tailles(ratio longueur/largeur) et résolutions d'écran.
>Y'a t'il un style CSS qui permet de fixer des "<div>"
Que voulez vous dire? Vos div se déplacent ils?
En html et avec CSS les éléments sont positionnés à la suite sauf si on veut les sortir du flux. Il y a 2 types de comportements pour les balises: inline et block. Inline (en ligne) va remplir l'espace restant sauf si l'espae est insuffisant. Block ira à la suite en utilisant sa propre ligne.
Quand un élément est fixé (fixed en CSS) il l'est par rapport à la page et l'on peut scroller la page il restera à la plae où il est fixé(donc toujours présent où que l'on soit dans la page); cela permet d'avoir par exemple un élément de navigation mais je ne pense pas que c'est ceci que vous voulez.
bg62
Messages postés
23663
Date d'inscription
samedi 22 octobre 2005
Statut
Modérateur
Dernière intervention
8 décembre 2024
2 391
23 juin 2013 à 12:02
23 juin 2013 à 12:02
ah !!!
et au départ la css est ???
et au départ la css est ???
cubeur78
Messages postés
98
Date d'inscription
mercredi 10 novembre 2010
Statut
Membre
Dernière intervention
23 août 2013
65
23 juin 2013 à 14:05
23 juin 2013 à 14:05
Il serait préférable d'avoir le lien de votre site ou le code.
Comme la dit dargihk, vos problème viennent du fait que vos dimensions sont sûrement en "px" et non en "%".
Comme la dit dargihk, vos problème viennent du fait que vos dimensions sont sûrement en "px" et non en "%".
dourlens59
Messages postés
65
Date d'inscription
vendredi 24 mai 2013
Statut
Membre
Dernière intervention
24 janvier 2017
23 juin 2013 à 15:20
23 juin 2013 à 15:20
Comme exemple voici le code mon header :
<div id="header" style="height:200px;" >
<br/>
<div id="boutonAccueil"><a class="bouton" href="accueil.php" > Accueil </a></div>
<div id="boutonFilm"><a class="bouton" href="listefilms.php?listefilm" > Film </a></div>
<div id="boutonSerie"><a class="bouton" href="listefilms.php?listeserie" > Serie </a></div>
<div id="boutonContact"><a class="bouton" href="contact.php" > Contact </a></div>
</div>
Et voici le css pour le header :
#header{
background-image:url(barreHaut.png);
background-repeat: no-repeat;
Float:center;
}
#boutonAccueil{
Float: left;
margin-left:275px;
margin-top: 112px;
font-weight: bold;
}
#boutonFilm{
Float: left;
margin-left:265px;
font-weight: bold;
margin-top: 112px;
}
#boutonSerie{
Float: left;
margin-left:265px;
font-weight: bold;
margin-top: 112px;
}
#boutonContact{
Float: left;
margin-left:255px;
font-weight: bold;
margin-top: 112px;
}
Quand je réduit ma page, les contenus texte de mes boutons vont faire un retour à la ligne. Je voudrais qu'il reste figer si on doit redimensionner la page
<div id="header" style="height:200px;" >
<br/>
<div id="boutonAccueil"><a class="bouton" href="accueil.php" > Accueil </a></div>
<div id="boutonFilm"><a class="bouton" href="listefilms.php?listefilm" > Film </a></div>
<div id="boutonSerie"><a class="bouton" href="listefilms.php?listeserie" > Serie </a></div>
<div id="boutonContact"><a class="bouton" href="contact.php" > Contact </a></div>
</div>
Et voici le css pour le header :
#header{
background-image:url(barreHaut.png);
background-repeat: no-repeat;
Float:center;
}
#boutonAccueil{
Float: left;
margin-left:275px;
margin-top: 112px;
font-weight: bold;
}
#boutonFilm{
Float: left;
margin-left:265px;
font-weight: bold;
margin-top: 112px;
}
#boutonSerie{
Float: left;
margin-left:265px;
font-weight: bold;
margin-top: 112px;
}
#boutonContact{
Float: left;
margin-left:255px;
font-weight: bold;
margin-top: 112px;
}
Quand je réduit ma page, les contenus texte de mes boutons vont faire un retour à la ligne. Je voudrais qu'il reste figer si on doit redimensionner la page
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
cubeur78
Messages postés
98
Date d'inscription
mercredi 10 novembre 2010
Statut
Membre
Dernière intervention
23 août 2013
65
23 juin 2013 à 15:48
23 juin 2013 à 15:48
J'ai quelques peu remanié ton code :
HTML
<header>
<div id="header">
<br/>
<span class="bouton_menu"><a class="bouton" href="accueil.php">Accueil</a></span>
<span class="bouton_menu"><a class="bouton" href="listefilms.php?listefilm">Film</a></span>
<span class="bouton_menu"><a class="bouton" href="listefilms.php?listeserie">Serie</a></span>
<span class="bouton_menu"><a class="bouton" href="contact.php">Contact</a></span>
</div>
</header>
CSS
#header
{
background-image:url(barreHaut.png);
background-repeat: no-repeat;
text-align:center;
}
.bouton_menu
{
margin-left:4%;
margin-right:4%;
font-weight: bold;
}
Tu peux modifier l'espace entre les mots dans le marin-left et le marin-right du CSS mais il faut que les deux restent identiques pour que ton menu soit centré
HTML
<header>
<div id="header">
<br/>
<span class="bouton_menu"><a class="bouton" href="accueil.php">Accueil</a></span>
<span class="bouton_menu"><a class="bouton" href="listefilms.php?listefilm">Film</a></span>
<span class="bouton_menu"><a class="bouton" href="listefilms.php?listeserie">Serie</a></span>
<span class="bouton_menu"><a class="bouton" href="contact.php">Contact</a></span>
</div>
</header>
CSS
#header
{
background-image:url(barreHaut.png);
background-repeat: no-repeat;
text-align:center;
}
.bouton_menu
{
margin-left:4%;
margin-right:4%;
font-weight: bold;
}
Tu peux modifier l'espace entre les mots dans le marin-left et le marin-right du CSS mais il faut que les deux restent identiques pour que ton menu soit centré
dourlens59
Messages postés
65
Date d'inscription
vendredi 24 mai 2013
Statut
Membre
Dernière intervention
24 janvier 2017
23 juin 2013 à 16:21
23 juin 2013 à 16:21
Merci de ta réponse, j'ai donc mis en place ton code, mais le problème c'est que le contenu Texte reste bloquer tous en haut, j'ai beau mettre "margin-top:" le texte reste figer tout en haut.
cubeur78
Messages postés
98
Date d'inscription
mercredi 10 novembre 2010
Statut
Membre
Dernière intervention
23 août 2013
65
23 juin 2013 à 16:23
23 juin 2013 à 16:23
tu veux le mettre où ?
dourlens59
Messages postés
65
Date d'inscription
vendredi 24 mai 2013
Statut
Membre
Dernière intervention
24 janvier 2017
23 juin 2013 à 16:28
23 juin 2013 à 16:28
J'aimerais pouvoir gérer son positionnement en venant du haut, j'avais mis la margin-top: à 112px
cubeur78
Messages postés
98
Date d'inscription
mercredi 10 novembre 2010
Statut
Membre
Dernière intervention
23 août 2013
65
23 juin 2013 à 16:35
23 juin 2013 à 16:35
il te suffit de rajouter cette ligne :
margin-top: X%;
au header dans le CSS en remplaçant X pour que ton menu soit décalé du haut de la fenêtre
margin-top: X%;
au header dans le CSS en remplaçant X pour que ton menu soit décalé du haut de la fenêtre
dourlens59
Messages postés
65
Date d'inscription
vendredi 24 mai 2013
Statut
Membre
Dernière intervention
24 janvier 2017
23 juin 2013 à 16:40
23 juin 2013 à 16:40
Quand je met cet ligne dans le header, le texte va bien descendre avec son image qui sera en arrière plan, mais le texte sera toujours en haut de l'image, alors qu'il faudrait qu'il descende dans l'image
cubeur78
Messages postés
98
Date d'inscription
mercredi 10 novembre 2010
Statut
Membre
Dernière intervention
23 août 2013
65
23 juin 2013 à 16:44
23 juin 2013 à 16:44
Sans l'image en question je ne peut pas trop t'aider