28172 sujets

CSS et mise en forme, CSS3

Gros probléme de comprehension sur le css gabarit 3colonnes

bonjour,

il est difficile d'être clair et explicite lorsque l'on ne maitrise pas un sujet aussi d'avance excusez moi si je m'embrouille un peux

le vif du sujet

je comprend le principe du gabarit avec 3 colonnes float ce que je souhaiterai pour le site de l'asso (j ai téléxharger sur le site de ALSACRÉATION

la colonne de gauche recevrait les liens utiles conseil général, caf, etc
la colonne de droite les liens de nos partenaires

jusque la je comprend ma feuille de style m'évitera de tout reconstruire à chaque nouvelle page
***********************************************************************

le pb comment à partir de ma page index.PHP 
<div id="entete">

<div id="page">

<div id="pieddepage">


mais ne pas appelé la colonne central afin de pouvoir modifié à chaque nouvelle page php créer

merci d'avance
Modifié par insertion85 (21 Feb 2011 - 11:08)
Bonjour, je ne suis pas certaine de bien comprendre ce que tu veux.

Je comprends que seulement la section centrale changera à chaque page. Donc, header, colonne gauche et droite et pied de page identiques sur toutes les pages.

As-tu regardé du côté de include en php ?
bonjour ça galope

et merci de ta réponse oui j'ai essayé include

mais l'appel d'une balise div doit avoir une syntaxe spécial que je ne trouve pas

cordialement
insertion85 a écrit :
bonjour ça galope


Je préfère Mabelle. Smiley cligne

insertion85 a écrit :
mais l'appel d'une balise div doit avoir une syntaxe spécial que je ne trouve pas


Euh... va falloir que tu expliques là... je ne saisis pas ce que tu cherches à faire Smiley confus
oups Mabelle sorry Smiley confused

en gros j'ai déja fait des sites mais ça remonte à loin à l'époque le css débutait et j'utilisais des iframes


là j ''esaye de faire un site qui utilise un gabarit feuille de style à 3 colonne pour une asso d'insertion

donc 3 colonnes dans celle celle de droite et de gauche le contenu ne changeras pas

le header accueil le menu

donc imaginons que j'ai à faire 10 pages

comment appelé le header, , la colonne droite et gauche

et pouvoir remplir le contenu de ma page

pfffffffff dur j'ai du mal à expliqué

peut être que je suis complètement dans la mauvaise direction

cordialemnt
Pas grave, on va finir par se comprendre !

Premièrement, les gabarits d'alsacréations contiennent la structure html et les styles css.

Deuxièmement, ce n'est pas avec les styles css que tu changes ton contenu.

La façon que je comprends ce que tu veux faire, c'est d'utiliser include. Tu dis que cela ne fonctionne pas mais le mieux serait que tu nous donnes un aperçu (mettre le code testé) de ce que tu as essayé pour que l'on puisse t'aider et voir pourquoi cela ne marche pas. Là, on manque d'information. L'idéal c'est une page en ligne.
merci Mabelle

je ne peux mettre une page en ligne j'essaye de construire en local

la page que j'appelle est le gabarit suivant:

3-colonnes-float-00.html

que j' ai telécharger ici http://www.alsacreations.com/static/gabarits/utiliser.html

ma page test.php

contient ce code minimaliste

<?php
include ("/pedagogia/gabarit.php/"); 
?>
<div id="page">


hors je n 'arrive pas à trouver la syntaxe pour n'appeler que

<div id="page

une fois ça trouvé je serais me débrouillé je pense pour les autres include de div

encore merci de ton temps donné
oups pardon Smiley decu

une erreur dans le message précédent voici le code de ma page test.php

<?php
include ("/pedagogia/gabarit.php/"); 
?>
<div id="page">
Si tu n'as pas de page en ligne, donne au moins le code complet de la page qui appelle test.php.

Il nous manque trop d'info pour t'aider. J'arrive difficilement à te comprendre...
désolé Mabelle

il me semble qu il y un un pb sur le forum car j'avais bien mis l'include dans les deux précédent message

voici le gode du gabarit débarrasser du texte d'exemple des colonnes

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
	
<head>
	<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
	<title>Gabarit CSS accessible: trois colonnes (float)</title>
	<style type="text/css">
	<!--
	* { font-family : Verdana,Geneva,Arial,Helvetica,sans-serif; }
	body {margin: 0; padding: 0;}
	
	/* =entete
	----------------------------- */
	#entete {color: black;background-color: #f79a10;}
	#entete h1 {margin: 0;}
	
	/* =page
	----------------------------- */
	#page {
		float:left;
		width: 100%;
		background: url(arriere-plan-30p100-70p100.png) repeat-y 30% 0%;
			/* "faux colomn": colonnes de meme hauteur
			 www.ilovejackdaniels.com/design/faux-columns-for-liquid-layouts  */
	}
	
	/* =nav
	----------------------------- */
	#nav {
		background-color: #ffb8bd;
		color: black;
		float: left;
		width: 29.99%; /* BUG IE: largeur reellement desiree: 30% */
		min-width: 10em;
	}
	
	/* masquage IE/mac + IE/win \*/
	html>body #nav {
		width: 30%; /* pour les navigateurs modernes: on redefini la largeur desiree initialement */
	}
	
	/* =main
	----------------------------- */
	#main {
		float: left;
		width: 70%;
		background: url(arriere-plan-55p100-45p100.png) repeat-y 60% 0%;
			/* "faux colomn": colonnes de meme hauteur
			 www.ilovejackdaniels.com/design/faux-columns-for-liquid-layouts  */
	}
	
	/* =contenu
	----------------------------- */
	#contenu {
		float: left;
		width: 55%;
		min-width: 15em;
		background-color: #b8deff;
		color: black;
	}
	
	/* =extra
	----------------------------- */
	#extra {
		float: left;
		width: 45%;
		background-color: #fffbb8;
		color: black;
	}
	
	/* =pieddepage
	----------------------------- */
	#pieddepage {clear: both;background: silver;color: black;}
	#pieddepage p {margin: 0;}
	-->
	</style>
</head>
<body>
	
<div id="entete">
	<h1>Gabarit CSS accessible: trois colonnes (float)</h1>
</div>

<div id="page">
	<div id="nav">
		<p>ICI JE MET DES IMAGES AVEC LIENS QUE JE SOUHAITE SUR TOUTES MES PAGES </p>
	</div> <!-- nav -->
	
	<div id="main">
		<div id="contenu">
			<h2>Article</h2>
			<p>CETTE PARTIE LA NE M'INTERESSE PAS</p>
		</div> <!--contenu-->
	
		<div id="extra">
			ICI JE MET DES LIENS VERS NOS PARTENAIRES QUE JE SOUHAITE SUR TOUTES MES PAGES</p>
		</div> <!--extra-->
	</div> <!--main-->
</div> <!--page-->

<div id="pieddepage">
	<p>Pied de page</p>
	<p>Validité <a href="http://validator.w3.org/check/referer" title="V&eacute;rifier la validit&eacute; de la page">XHTML Strict</a>
		et <a href="http://jigsaw.w3.org/css-validator/check/referer" title="V&eacute;rifier la validit&eacute; de la feuille de styles">CSS</a>.</p>
</div>


donc j'ai mon gabarit à la racine du site

Avec dreamweaver8

je créer une page appelé test4.php

Dans cette page j'aimerai que s'affiche avec la mise en forme les div suivantes (puisque le contenu sera invariable)

<div id="page">

<div id="extra">


mais 
<div id="contenu">


dois changer pour chaque page que je vais créer; Tout mon problème est là

Si dans test4 je fais

<?php
include ("/pedagogia/gabarit.html");
?>


J'ai le gabarit complet y compris "contenu"

j'espère que ces précisions te seront utiles

cordialement

Ps tu monte à cheval ?
Il faut que tu fasses le contraire, partir du fichier gabarit (que tu peux renommer test4.php) et faire les modifications en ajoutant les include des éléments qui reste identique sur chaque page.

Par exemple, tu remplaces 

<div id="entete"> 
    <h1>Gabarit CSS accessible: trois colonnes (float)</h1> 
</div>

Par

<?php 
include ('header.inc.php'); 
?>

Et dans le fichier header.inc.php, tu as

<div id="entete"> 
    <h1>Gabarit CSS accessible: trois colonnes (float)</h1> 
</div>


Je t'invite à relire l'article donné plus haut sur comment inclure un fichier dans un autre. Tout ceci est très bien expliqué.

Je crois que tu as tous les éléments en main pour réussir.

Bonne continuation Smiley cligne

insertion85 a écrit :
Ps tu monte à cheval ?

PS non, le cheval est mon animal préféré. Et "Ça galope" vient d'un personnage de Michel Folco...
Bonsoir Mabelle

Désoler d'avoir mis du temps à te répondre

ta dernière réponse m'a fait énormément progresser

le lien que tu m as donné en début de post je l avais déjà parcouru je cherche depuis 15 jours. .mais je dois avouer qu'il me déstabilise

par exemple au lieu de modifier la feuille de style avec les includes comme tu me l a expliquer je faisait l'inverse.

bon plutôt que de te saouler de posts je vais explorer et te tiendrais au courant

dans un premier temps il me semble que j ai un soucis de droit sous Linux malgré que j'ai fait une autorisation lecture écriture en sudo

en effet dans l'aperçu du navigateur j'ai cette erreur

Warning: include(/gabarit.php/entete.inc.php) [function.include]: failed to open stream: No such file or directory in /var/www/pedagogia/test4.php on line 2

Warning: include() [function.include]: Failed opening '/gabarit.php/entete.inc.php' for inclusion (include_path='.:/usr/share/php:/usr/share/pear') in /var/www/pedagogia/test4.php on line 2

et en dessous les modifs sont prise en compte

si tu as toujours la même patience voila à quoi je veux arriver surtout le menu vu que le site s'adresse a des personne ayant des difficultés moteurs ou visuel

le gabarit par l'exemple

http://www.fairytells.net/gabarit_accessible/V2/index-withmenu6.php?style=preferred&change_style=OK

les explications

http://www.fairytells.net/index.php/2006/06/26/28-menu-deroulant-et-accessibilite-partie-1

http://www.fairytells.net/index.php/2006/07/22/35-la-recette-pour-un-menu-deroulant-accessible-partie-2

le zip se trouve en partie 2 dans conclusions

Qui est pedagogia

Une asso permettant l'insertion ou la réinsertion de personnes en grandes difficultés (elles sont vaste, pb physique, alphabétisation, initiation ou remise à niveaux scolaire, atelier de production adaptés, etc, sur la Vendée par des contrats aidés.)

voici pourquoi je tiens à les aidés avec un site qui sera hébergé directement chez eux

merci de ton aide

cordialement Smiley smile

Ps : ayant été plus jeune prof d'équitation j'ai fait une recherche sur Michel Folco et du personnage dont tu parles sans trouver de liens

je trouverais peut être demain ce soir j'ai la tête comme une montgolfière
insertion85 a écrit :

dans un premier temps il me semble que j ai un soucis de droit sous Linux malgré que j'ai fait une autorisation lecture écriture en sudo

en effet dans l'aperçu du navigateur j'ai cette erreur

Warning: include(/gabarit.php/entete.inc.php) [function.include]: failed to open stream: No such file or directory in /var/www/pedagogia/test4.php on line 2

Warning: include() [function.include]: Failed opening '/gabarit.php/entete.inc.php' for inclusion (include_path='.:/usr/share/php:/usr/share/pear') in /var/www/pedagogia/test4.php on line 2



Tu as plutôt un problème de chemin.

Puisque tu es sous Linux, si tu donnes un chemin qui commence par / l'inclusion va se faire depuis la racine du disque et non depuis le dossier où est situé ton fichier.

En plus tu donnes comme nom du 1er dossier "gabarit.php". Ton dossier s'appelle vraiment comme ça ?
Bonsoir Mabelle

hé bien non je ni arrive pas

ton dernier post faisant allusion au system de fichier linux à fait que j'ai installé xamp sous seven.

j'ai vérifié tous les droits d'accès en lecture écriture notamment htdoc

je suis retourné sur le lien que tu m'as données

j'ai essayé les chemins includes avec ou sans /

avec ../ (bien que les deux fichiers soit à la racine)

avec require_once(dirname(__FILE__) . '/includes/*********.php');

******************

oui ma page gabarit est bien: gabarit.php, ta remarque m' aillant interpellé je l'ai renomer en html sans résultat et suis repasé en .php, je l'appelle de ma pages test4.php

Alors ce qui est super les includes marches du moins pour ce début, avec dreamweaver en création ça passe sans pb et dès que je fais dans le navigateur la page s affiche mais au dessus il y a les messages d'erreurs

********************
donc je te met ci dessous

l'include de la page gabarit.php

	
<?php  
include ('header.inc.php');  
?>


réponse du navigateur
Warning: include(header.inc.php) [function.include]: failed to open stream: No such file or directory in C:\xampp\htdocs\pedagogia\gabarit.php on line 81

Warning: include() [function.include]: Failed opening 'header.inc.php' for inclusion (include_path='.;C:\xampp\php\PEAR') in C:\xampp\htdocs\pedagogia\gabarit.php on line 81


no such file ..... ok il ne trouve pas la page mais en quoi ma syntaxe est fausse

******************************

A partir de test4 l'appel

maintenant l'appel à partir de test4
<?php  
include ('header.inc.php'); 
?>

<div id="entete">
    <h1 align="center">Pedagogia bienvenu</h1>  
</div>


même retour du navigateur

*******************************************

j'ai essayé avec le header du menu que je souhaite génial toutes les fonctions agrandissements des polices, nav claviers fonctionne Smiley biggrin


mais même erreur

cordialement
Sujet clos
Aller à