[Resolu] Problème CSS

Note de ce sujet :
  • Moyenne : 0 (0 vote(s))
  • 1
  • 2
  • 3
  • 4
  • 5
#1
Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: #1.10.3
#~ Url du site :
#~ Hébergeur / Soft :
#~ Informations Système :
#~ EasyPhp
#~ Site en Local
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~

Bonjour à tous,
Je viens d'installer CMSMS, et je tente de modifier le template du site.
Pour cela j'ai donc ajouter une nouvelle feuille de style, dont voici un extrait (c'est celui qui nous interesse) :
Code :
body {
    margin: 0;
    padding: 0;
background: #FEEDB9 url(images/img01.jpg) repeat-x left top;

    text-align: justify;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 13px;
    color: #2F4600;
}
...

J'ai ensuite crée un template auquel j'ai associé cette feuille de style, dont voici un extrait (c'est celui qui nous interesse ) :
Code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>{sitename} - {title}</title>
{metadata}
{cms_stylesheet}
</head>
<body >
<!-- start header -->
<div id="header">
    <div id="logo">
        <h2><a href="#">{sitename}</a></h2>
        <p>Image ICI</p>
    </div>
    <div id="menu">
        <ul>
            <li class="current_page_item"><a href="#">home</a></li>
            <li><a href="#">photos</a></li>
            <li><a href="#">about</a></li>
            <li><a href="#">links</a></li>
            <li><a href="#">contact</a></li>
        </ul>
    </div>
</div>
<!-- end header -->
<div id="headerbg">&nbsp;</div>
<!-- start page -->
<div id="page">
    <!-- start content -->
    <div id="content">
...

J'ai appliqué ce gabarit à l'ensemble des pages. Mon problème est le suivant :
La balise "background" de body du css refuse de s'afficher dans la page. Un test en le mettant directement dans le body fonctionne.

Pourriez vous m'aider ?

D'avance merci
#1
Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: #1.10.3
#~ Url du site :
#~ Hébergeur / Soft :
#~ Informations Système :
#~ EasyPhp
#~ Site en Local
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~

Bonjour à tous,
Je viens d'installer CMSMS, et je tente de modifier le template du site.
Pour cela j'ai donc ajouter une nouvelle feuille de style, dont voici un extrait (c'est celui qui nous interesse) :
Code :
body {
    margin: 0;
    padding: 0;
background: #FEEDB9 url(images/img01.jpg) repeat-x left top;

    text-align: justify;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 13px;
    color: #2F4600;
}
...

J'ai ensuite crée un template auquel j'ai associé cette feuille de style, dont voici un extrait (c'est celui qui nous interesse ) :
Code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>{sitename} - {title}</title>
{metadata}
{cms_stylesheet}
</head>
<body >
<!-- start header -->
<div id="header">
    <div id="logo">
        <h2><a href="#">{sitename}</a></h2>
        <p>Image ICI</p>
    </div>
    <div id="menu">
        <ul>
            <li class="current_page_item"><a href="#">home</a></li>
            <li><a href="#">photos</a></li>
            <li><a href="#">about</a></li>
            <li><a href="#">links</a></li>
            <li><a href="#">contact</a></li>
        </ul>
    </div>
</div>
<!-- end header -->
<div id="headerbg">&nbsp;</div>
<!-- start page -->
<div id="page">
    <!-- start content -->
    <div id="content">
...

J'ai appliqué ce gabarit à l'ensemble des pages. Mon problème est le suivant :
La balise "background" de body du css refuse de s'afficher dans la page. Un test en le mettant directement dans le body fonctionne.

Pourriez vous m'aider ?

D'avance merci
#2
Bonjour et bienvenue,

Pour tes prochaines interventions, merci de renseigner les informations système demandées dans le formulaire du post.

As-tu vérifié si le chemin de l'image est le bon ? Il te faut utiliser [[root_url]] pour indiquer la racine du site :
Code :
background: #FEEDB9 url([[root_url]]/images/img01.jpg) repeat-x left top;
si l'image se trouve effectivement dans le répertoire www/images/ et pas dans www/uploads/images/

Attention également qu'il n'y ait pas d'autres propriétés css (autre feuille de style attachée au gabarit et placée après) qui écraseraient celle-ci.
Utilise l'extension FireBug, tu trouveras tout de suite d'où proviennent tes problèmes css (et autres).

Pour d'autres problèmes de css, utilise plutôt le forum "graphisme", celui-ci étant réservé aux problèmes de modules ou tags.
#2
Bonjour et bienvenue,

Pour tes prochaines interventions, merci de renseigner les informations système demandées dans le formulaire du post.

As-tu vérifié si le chemin de l'image est le bon ? Il te faut utiliser [[root_url]] pour indiquer la racine du site :
Code :
background: #FEEDB9 url([[root_url]]/images/img01.jpg) repeat-x left top;
si l'image se trouve effectivement dans le répertoire www/images/ et pas dans www/uploads/images/

Attention également qu'il n'y ait pas d'autres propriétés css (autre feuille de style attachée au gabarit et placée après) qui écraseraient celle-ci.
Utilise l'extension FireBug, tu trouveras tout de suite d'où proviennent tes problèmes css (et autres).

Pour d'autres problèmes de css, utilise plutôt le forum "graphisme", celui-ci étant réservé aux problèmes de modules ou tags.
#3
Que ce code ne s'affiche pas dans la feuille de style générée ça m'étonnerait beaucoup... par contre que l'image définie dans ton code CSS ne pointe pas vers une url d'image valable... ça j'en mettrais ma main à couper.

sous firefox tu installes firebug et tu vérifies ton code CSS tu t'apercevras rapidement que l'url pointe vers une 404

solution ?

Code :
background: #FEEDB9 url([[root_url]]/uploads/images/img01.jpg) repeat-x left top;

par habitude conserve tes images de design sous le répertoire ./uploads pour te faciliter les opérations de maintenance telles que les sauvegardes/restores

edit : damned... Jean qui me dame le pion Big Grin
#3
Que ce code ne s'affiche pas dans la feuille de style générée ça m'étonnerait beaucoup... par contre que l'image définie dans ton code CSS ne pointe pas vers une url d'image valable... ça j'en mettrais ma main à couper.

sous firefox tu installes firebug et tu vérifies ton code CSS tu t'apercevras rapidement que l'url pointe vers une 404

solution ?

Code :
background: #FEEDB9 url([[root_url]]/uploads/images/img01.jpg) repeat-x left top;

par habitude conserve tes images de design sous le répertoire ./uploads pour te faciliter les opérations de maintenance telles que les sauvegardes/restores

edit : damned... Jean qui me dame le pion Big Grin
#4
Deux pour le prix d'un LOL
#4
Deux pour le prix d'un LOL
#5
Effectivement cela marche beaucoup mieux avec root_url !

Merci Wink
#5
Effectivement cela marche beaucoup mieux avec root_url !

Merci Wink


Atteindre :


Utilisateur(s) parcourant ce sujet : 1 visiteur(s)