Petite question en html.
Résolu
accroalavie
Messages postés
7
Date d'inscription
Statut
Membre
Dernière intervention
-
accroalavie Messages postés 7 Date d'inscription Statut Membre Dernière intervention -
accroalavie Messages postés 7 Date d'inscription Statut Membre Dernière intervention -
Bonjour à tous ,
Alors voila, je voulais savoir comment font certains Webmasters, pour créer
des tetes de page auto-extencible où les objets ne se chevauchent pas quand
on reduit un peu trop le site ^^ .
Comme par exemple, la tete de page du site www.siteduzero.com où les élements (logo,connexion,annonces)
se bloquent apres une certaine limite de largeur.
J'ai bien cherché une instruction sur le net , et meme essayé avec des conditions en php mais ne pense pas qu'on puisse integrer une position dans une condition :
comme <?php if (left <400px) {?> left:400px; <?php } ?>
La je bloque :( ....
si quelqu'un connait une petite astuce, ça ne serait pas de refus ! :D
Alors voila, je voulais savoir comment font certains Webmasters, pour créer
des tetes de page auto-extencible où les objets ne se chevauchent pas quand
on reduit un peu trop le site ^^ .
Comme par exemple, la tete de page du site www.siteduzero.com où les élements (logo,connexion,annonces)
se bloquent apres une certaine limite de largeur.
J'ai bien cherché une instruction sur le net , et meme essayé avec des conditions en php mais ne pense pas qu'on puisse integrer une position dans une condition :
comme <?php if (left <400px) {?> left:400px; <?php } ?>
La je bloque :( ....
si quelqu'un connait une petite astuce, ça ne serait pas de refus ! :D
A voir également:
- Petite question en html.
- Editeur html - Télécharger - HTML
- Petite amie virtuelle en français gratuit - Accueil - Intelligence artificielle
- Espace en html - Astuces et Solutions
- Br html ✓ - Forum Webmastering
- Espace HTML ✓ - Forum HTML
5 réponses
Bonjour,
Effectivement c'est grâce aux propriétés CSS que tu y arriveras. 2 méthodes s'offrent à toi :
- Un layout (mise en page) en utilisant des % (ex : width:30%)
- Un layout utilisant les les propriétés "maw-width" et "min-width" mais ces propriétés ne seront pas prises en compte par IE6.
Voici un article en anglais qui pourra t'aider sur la question.
Effectivement c'est grâce aux propriétés CSS que tu y arriveras. 2 méthodes s'offrent à toi :
- Un layout (mise en page) en utilisant des % (ex : width:30%)
- Un layout utilisant les les propriétés "maw-width" et "min-width" mais ces propriétés ne seront pas prises en compte par IE6.
Voici un article en anglais qui pourra t'aider sur la question.
Et surtout ça marche pas. PHP travaille coté serveur donc si ton client redimensionne la page, ton css n'est plus valide.
Je vais essayer de te faire un truc avec 3 zone, une a droite, une a gauche et une au centre, c'est un début de solution...
La ça marche mais ils se chevauchent. J'ai mis le CSS inline.
Je vais essayer de te faire un truc avec 3 zone, une a droite, une a gauche et une au centre, c'est un début de solution...
<div id="entete" style="background-color:#CCCC33; color:#000000; position:absolute; top:0px; left:0px; width:100%; height:25px;">
<div id="gauche" style="position:static; float:left; width:200px; border:#000000 thin solid; z-index:auto; display:block;">gauche</div>
<div id="droite" style="position:static; float:right; width:200px; border:#000000 thin solid; z-index:auto; display:block;">droite</div>
<div id="centre" style="position:absolute; left:50%; top: 0px; margin-left:-100px; width:200px; border:#000000 thin solid; z-index:auto; display:block;">centre</div>
</div>
La ça marche mais ils se chevauchent. J'ai mis le CSS inline.
C'est sur le CSS et le HTML que tu joues pour obtenir ça pas sur php
Pour solutionner le problème de chevauchement, tu peux faire passer le div centre comme étant un élément du div gauche.
En espérant t'avoir aidé...
En espérant t'avoir aidé...
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
haaaa , je vous remercie pour vos reponses et aussi le tuto english ^^ , ça ma inspiré .
Je me suis acharné comme un legume sur les positions (left:...%) depuis une semaine et je trouvais frustrant l'absence de min-left mais je me plantais completement .
C'etait tout simple , avec des div, en gerant le width et le min-width .
J'ai inséré l'image dans la div et ajouté un petit "text-align:right" dans le css.
La position de l'image dependait ainsi de la largeur de la div, et comme ça, on peut définir des limites pour eviter le chevauchement.
(je dit tout ca pour celui qui passerais avec le meme probleme ^^).
j'vous remercie , sans vous, je serais encore dans la galere :D .
Je me suis acharné comme un legume sur les positions (left:...%) depuis une semaine et je trouvais frustrant l'absence de min-left mais je me plantais completement .
C'etait tout simple , avec des div, en gerant le width et le min-width .
J'ai inséré l'image dans la div et ajouté un petit "text-align:right" dans le css.
La position de l'image dependait ainsi de la largeur de la div, et comme ça, on peut définir des limites pour eviter le chevauchement.
(je dit tout ca pour celui qui passerais avec le meme probleme ^^).
j'vous remercie , sans vous, je serais encore dans la galere :D .
