Responsive
Fermé
pivoine71
Messages postés
2
Date d'inscription
lundi 19 décembre 2016
Statut
Membre
Dernière intervention
20 mars 2017
-
20 mars 2017 à 11:14
Pierrecastor Messages postés 41110 Date d'inscription mercredi 5 novembre 2003 Statut Modérateur Dernière intervention 15 mars 2023 - 20 mars 2017 à 16:16
Pierrecastor Messages postés 41110 Date d'inscription mercredi 5 novembre 2003 Statut Modérateur Dernière intervention 15 mars 2023 - 20 mars 2017 à 16:16
3 réponses
Technoinfo
Messages postés
353
Date d'inscription
jeudi 6 octobre 2016
Statut
Membre
Dernière intervention
17 avril 2021
170
20 mars 2017 à 11:23
20 mars 2017 à 11:23
Bonjour.
Je ne peux pas répondre a ta question, mais voila un code tout pret pour du responsive:
Tu peux essayer de modifier un peu les propriétés CSS pour que tout s'affiche de la même couleur.
Coridalement.
Technoinfo.
Source du code :https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox?redirectlocale=en-US&redirectslug=CSS%2FTutorials%2FUsing_CSS_flexible_boxes
Je ne peux pas répondre a ta question, mais voila un code tout pret pour du responsive:
<!DOCTYPE html>
<html lang="en">
<head>
<style>
body {
font: 24px Helvetica;
background: #999999;
}
#main {
min-height: 800px;
margin: 0;
padding: 0;
display: flex;
flex-flow: row;
}
#main > article {
margin: 4px;
padding: 5px;
border: 1px solid #cccc33;
border-radius: 7pt;
background: #dddd88;
flex: 3 1 60%;
order: 2;
}
#main > nav {
margin: 4px;
padding: 5px;
border: 1px solid #8888bb;
border-radius: 7pt;
background: #ccccff;
flex: 1 6 20%;
order: 1;
}
#main > aside {
margin: 4px;
padding: 5px;
border: 1px solid #8888bb;
border-radius: 7pt;
background: #ccccff;
flex: 1 6 20%;
order: 3;
}
header, footer {
display: block;
margin: 4px;
padding: 5px;
min-height: 100px;
border: 1px solid #eebb55;
border-radius: 7pt;
background: #ffeebb;
}
/* Too narrow to support three columns */
@media all and (max-width: 640px) {
#main, #page {
flex-direction: column;
}
#main > article, #main > nav, #main > aside {
/* Return them to document order */
order: 0;
}
#main > nav, #main > aside, header, footer {
min-height: 50px;
max-height: 50px;
}
}
</style>
</head>
<body>
<header>header</header>
<div id='main'>
<article>article</article>
<nav>nav</nav>
<aside>aside</aside>
</div>
<footer>footer</footer>
</body>
</html>
Tu peux essayer de modifier un peu les propriétés CSS pour que tout s'affiche de la même couleur.
Coridalement.
Technoinfo.
Source du code :https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox?redirectlocale=en-US&redirectslug=CSS%2FTutorials%2FUsing_CSS_flexible_boxes
Pierrecastor
Messages postés
41110
Date d'inscription
mercredi 5 novembre 2003
Statut
Modérateur
Dernière intervention
15 mars 2023
4 186
20 mars 2017 à 11:35
20 mars 2017 à 11:35
Salut
Tu as crée ce site toi même ? Avec des outils, framework, CMS ou autre ?
Parce que c'est "un poil" plus compliqué que ça pour rendre un site responsive.
Tu as crée ce site toi même ? Avec des outils, framework, CMS ou autre ?
Parce que c'est "un poil" plus compliqué que ça pour rendre un site responsive.
Bonjour à tous, merci de vos messages
J'ai créé mon site moi même avec dreamweaver et suis pas une pro. J'ai repris une base d'un autre site et me suis débrouillée.
Avant pas de soucis la phrase meta que j'avais mise suffisait mais plus maintenant....
Si je fais comme j'ai compris le responsive par rapport à ce que j'ai lu , il faut paramétrer le CSS selon les principaux formats mais je me suis dit qu'il y avait peut être comme avant un "style type"......
Voilà
A vous lire, cordialement
J'ai créé mon site moi même avec dreamweaver et suis pas une pro. J'ai repris une base d'un autre site et me suis débrouillée.
Avant pas de soucis la phrase meta que j'avais mise suffisait mais plus maintenant....
Si je fais comme j'ai compris le responsive par rapport à ce que j'ai lu , il faut paramétrer le CSS selon les principaux formats mais je me suis dit qu'il y avait peut être comme avant un "style type"......
Voilà
A vous lire, cordialement
Pierrecastor
Messages postés
41110
Date d'inscription
mercredi 5 novembre 2003
Statut
Modérateur
Dernière intervention
15 mars 2023
4 186
20 mars 2017 à 16:16
20 mars 2017 à 16:16
Avec dreamweaver en utilisant l'éditeur graphique ? Si c'est le cas, ça risque d'être chaud patate pour le transformer en responsive facilemen, vu le code moche que pond dreamweaver.
Le site est en ligne ? Qu'on puisse voir en direct ce que l'on peut faire ?
Le site est en ligne ? Qu'on puisse voir en direct ce que l'on peut faire ?
20 mars 2017 à 11:37
Ca n'a pas grand chose d'un code tout fait vu qu'il ne correspond qu'a un exemple basique et au fichier HTML donné dans le tuto. Il ne correspondra surement pas au site de Pivoine71