pagina indipendente dallo stile generale

**iacoposk8** · 01-10-2010, 09:56

Ciao a tutti!!! Vorrei mettere in drupal un menu in javascript che avevo costruito io un pò di tempo a dietro.
il menu è composto da un file html dove è contenuto l'elenco delle voci, il file css dove è descritto lo stile del menu e poi il file js per i vari effetti del menu.
Se io modifico il template basterà aggiungere <?php include"menu.html" ?> rimuovendo il precedente div del menu.
Solo che il menu ora avrà lo stesso stile del precedente menu!!!
Probabilmente perchè è conenuto in un div più grande che ne omogenizza lo stile.
Che voi sappiate, esiste il modo per mettere quel file html indipendente?
Nel senso, se io lo apro singolarmente il menu lo vedo perfetto, se lo inserisco nel template di drupal mi mette lo stile di drupal perchè dipende dai sui css, invece io vorrei che il menu seguisse il suo stile e tutto il resto lo stile drupal.

Riguarda i CMS però l'ho messa qua perchè è un problema dovuto dai css, il cms di per se conta poco.
grazie

**codencode** · 01-10-2010, 10:05

Puoi editare il css del menu e rendere le regole presenti più specifiche in modo che sovrascrivano le regole generali che Drupal mette di default.
All'occorrenza puoi aumentare la "forza" delle regole con !important.

**iacoposk8** · 01-10-2010, 10:36

riporto in fondo il mio css:
ho cambiato tutto da #nav che è spesso usato a #nav-miomenu, non so come essere più specidico

però non cambia nulla... in che modo potri essere più specifico?

codice:

ul#nav-miomenu{font-size:12pt; font-family:arial;}

ul#nav-miomenu,ul#nav-miomenu li,ul#nav-miomenu ul,ul#nav-miomenu ul li{margin:0;padding:0;list-style-type:none}

ul#nav-miomenu{height:45px;line-height:40px;margin-left:0px;

    background: #262b30;color: #fff}

ul#nav-miomenu a{display:block;padding: 0 15px;text-decoration: none; color:#FFF;}

ul#nav-miomenu li{float: left;position: relative}

ul#nav-miomenu li li{float: none;line-height: 22px;

    display:block !important;display: inline; /*IE*/}

ul#nav-miomenu ul{position: absolute;top: 40px;left: -9999px;

    width: 12em;background: #fff;color: #333333}

ul#nav-miomenu ul{padding: 7px 0;border: 1px solid #1d2023}

ul#nav-miomenu ul,ul#nav-miomenu li li a{background-color: #262b30;color: #3c4f4e;}

ul#nav-miomenu li:hover,ul#nav-miomenu a:hover{background-color: #1d2023;color: #FFF; height: 45px;line-height:40px;}

ul#nav-miomenu li:hover ul,ul#nav-miomenu li.sfhover ul{left: -1px;z-index: 100}

**codencode** · 01-10-2010, 11:38

Sei sicuro che nell'HTML sia stato correttamente assegnato l'id nav-miomenu?
Se si, prova ad usare !important e vedi se cambia qualcosa.

**iacoposk8** · 01-10-2010, 12:06

penso di si, ora leggo come funziona importante e lo uso

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<title>Menu dropdown in stile Facebook - Esempio di base</title>

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">

<meta name="generator" content="HAPedit 3.1">

<style type="text/css">

html,body{margin:0;padding:0}

body{background:#FFF;color:#333}

div#container{height:45px;width:100%;margin:0 auto;background: #333333;color:#fff}

</style>

<link rel="stylesheet" type="text/css" href="menu-dd.css">

</head>

<body>

<div id="container">

<ul id="nav-miomenu">
[*]

    HOME


[*]

    CHI SIAMO

    <ul>
[*]Il gruppo
[*]Mission<span></span>
[*]Storia & valori
[*]Gallery[*]Staff
[/list]


[*]

    DOUBLE AGENCY

    <ul>
[*]Immaginando
[*]Imgstudio
[/list]

[*]

    CONTATTI


[/list]

</div>

</body>

</html>

**iacoposk8** · 01-10-2010, 12:14

quindi il css diventa così... però non va ancora...

codice:

ul#nav-miomenu{font-size:12pt !important; font-family:arial !important;}

ul#nav-miomenu,ul#nav-miomenu li,ul#nav-miomenu ul,ul#nav-miomenu ul li{margin:0 !important;padding:0 !important;list-style-type:none}

ul#nav-miomenu{height:45px !important;line-height:40px !important;margin-left:0px !important;

    background: #262b30 !important;color: #fff}

ul#nav-miomenu a{display:block !important;padding: 0 15px !important;text-decoration: none !important; color:#FFF !important;}

ul#nav-miomenu li{float: left !important;position: relative}

ul#nav-miomenu li li{float: none !important;line-height: 22px !important;

    display:block !important !important;display: inline !important; /*IE*/}

ul#nav-miomenu ul{position: absolute !important;top: 40px !important;left: -9999px !important;

    width: 12em !important;background: #fff !important;color: #333333}

ul#nav-miomenu ul{padding: 7px 0 !important;border: 1px solid #1d2023}

ul#nav-miomenu ul,ul#nav-miomenu li li a{background-color: #262b30 !important;color: #3c4f4e !important;}

ul#nav-miomenu li:hover,ul#nav-miomenu a:hover{background-color: #1d2023 !important;color: #FFF !important; height: 45px !important;line-height:40px !important;}

ul#nav-miomenu li:hover ul,ul#nav-miomenu li.sfhover ul{left: -1px !important;z-index: 100}

**codencode** · 01-10-2010, 16:40

Hai possibilità di metterlo on line?

**iacoposk8** · 01-10-2010, 17:36

si, sta sera creo un sito su altervista e cerco di capire come caricarlo... tanto è un sito così, giusto da imparare un minimo drupal, grazie mille dell'aiuto intanto

**iacoposk8** · 02-10-2010, 20:26

ecco qua: http://provamezdevelope.altervista.org/
è il menu orizzontale più in alto, vien tutto sbagliato!perchè lo stampa in verticale e non orizzontale senza nessun effetto

**iacoposk8** · 04-10-2010, 16:56

non c'è modo per sistemare questo menu?

Discussione: pagina indipendente dallo stile generale

Strumenti discussione

Ricerca discussione

Visualizza

pagina indipendente dallo stile generale

Permessi di invio