Visualizzazione risultati 1 fino 25 di 25

Discussione: Modifca menù css-posizione

  1. 13-09-2011, 18.03.45 #1
    Guest

    Predefinito Modifca menù css-posizione

    Buongiorno, ho creato online un menù orizzontale (questo è il sito: http://criopera.altervista.org/index.php) che funziona bene, l'unico problema è che vorrei far sì che le voci siano centrate rispetto alla pagina, questo è il codice:
    Codice:
    ul.menu {
list-style-type:none;
width:auto;
position:relative;
display:block;
height:33px;
font-size:12px;
background:url(images/bg.png) repeat-x top left;
font-family:Verdana,Helvetica,Arial,sans-serif;
border:1px solid #000;
margin:0;
padding:0;
}

ul.menu li {
display:block;
float:left;
margin:0;
padding:0;
}

ul.menu li a {
float:left;
color:#A79787;
text-decoration:none;
height:24px;
padding:9px 15px 0;
font-weight:big;
}

ul.menu li a:hover,.current {
color:#fff;
background:url(images/bg.png) repeat-x top left;
text-decoration:none;
}

ul.menu .current a {
color:#fff;
font-weight:700;
}


/*RED*/
ul.menu.red{
background-color:#B11718;
}
ul.menu.red li a:hover, .menu.red li.current {
background-color:#DE3330;
}
    Come posso fare?

    EDIT:

    Pardon, queste sono le informazioni di stile ovviamente ;)
    Ultima modifica di alemoppo : 13-09-2011 alle ore 20.39.22 Motivo: Non fare post consecutivi: usa il tasto "Edita"
     
  2. 13-09-2011, 18.19.59 #2
    Guest

    Predefinito

    Ingloba, se lo è già, il menu in un div e per quest'ultimo imposta una larghezza inferiore alla pagina (anche in forma %) e i margini ad auto.
  3. 13-09-2011, 18.20.55 #3
    Guest

    Predefinito

    Mi faresti una rapida traduzione di quello che hai detto? O meglio, mi diresti come farlo? :D
  4. 13-09-2011, 18.23.12 #4
    Guest

    Predefinito

    Usa text-align.

    EDIT:
    simpleticket voleva dire di impostare il width.
  5. 13-09-2011, 18.26.12 #5
    Guest

    Predefinito

    Ok, ma come faccio praticamente?
    Il codice è:
    Codice:
    <head>
	<link rel="stylesheet" href="/menu/menu_style.css" type="text/css" />
</head>

<ul class="menu red">

  <li class="current"><a href="http://www.cri.it/flex/cm/pages/ServeBLOB.php/L/IT/IDPagina/1" target="_self">Sito CRI</a></li>
  <li><a href="http://criopera.altervista.org/Pionieri.html" target="_self">Pionieri</a></li>
  <li><a href="http://criopera.altervista.org/VdS.html" target="_self">VdS</a></li>
  <li><a href="http://criopera.altervista.org/SezFemminile.html" target="_self">Sez. Femminile</a></li>
  <li><a href="http://criopera.altervista.org/Capisquadra.html" target="_self">Capisquadra</a></li>
  <li><a href="http://criopera.altervista.org/Mezzi.html" target="_self">Mezzi</a></li>
  <li><a href="http://criopera.altervista.org/Servizi.html" target="_self">Servizi</a></li>
  <li><a href="http://criopera.altervista.org/LaSede.html" target="_self">La sede</a></li>
  <li><a href="http://criopera.altervista.org/Contatti.html" target="_self">Contatti</a></li>


</ul>
  6. 13-09-2011, 18.26.24 #6
    Guest

    Predefinito

    Citazione Originalmente inviato da testpanco Visualizza messaggio
    Mi faresti una rapida traduzione di quello che hai detto? O meglio, mi diresti come farlo? :D
    nel body
    Codice HTML:
    <div id="boxmenu">
  <!-- il menu -->
</div>
    nell'head

    Codice HTML:
    <style>
  ...
  #boxmenu{
    width: 75%;  /*Lo adatti alle tue necessità*/
    margin: auto;
  ...
</style>
    Se usi text-align, tutto sarà centrato (anche il contenuto del menu ...).
    Come ti dico sarà centrato, rispetto alla pagina, il blocco del menu, mentre il resto manterrà l'allineamtneto che aveva.
    Ultima modifica di simpleticket : 13-09-2011 alle ore 18.28.23
  7. 13-09-2011, 18.31.45 #7
    Guest

    Predefinito

    Ho modificato portando il codice a:
    Codice:
    <head>
	<link rel="stylesheet" href="/menu/menu_style.css" type="text/css" />
<style>
  
  #boxmenu{
    width: 75%;  /*Lo adatti alle tue necessità*/
    margin: auto;

</style>
</head>
<body>
<div id="boxmenu">
<ul class="menu red">

  <li class="current"><a href="http://www.cri.it/flex/cm/pages/ServeBLOB.php/L/IT/IDPagina/1" target="_self">Sito CRI</a></li>
  <li><a href="http://criopera.altervista.org/Pionieri.html" target="_self">Pionieri</a></li>
  <li><a href="http://criopera.altervista.org/VdS.html" target="_self">VdS</a></li>
  <li><a href="http://criopera.altervista.org/SezFemminile.html" target="_self">Sez. Femminile</a></li>
  <li><a href="http://criopera.altervista.org/Capisquadra.html" target="_self">Capisquadra</a></li>
  <li><a href="http://criopera.altervista.org/Mezzi.html" target="_self">Mezzi</a></li>
  <li><a href="http://criopera.altervista.org/Servizi.html" target="_self">Servizi</a></li>
  <li><a href="http://criopera.altervista.org/LaSede.html" target="_self">La sede</a></li>
  <li><a href="http://criopera.altervista.org/Contatti.html" target="_self">Contatti</a></li>
</ul>
</div>
</body>
    Ma non ottengo il risultato voluto; ho sbagliato qualcosa e se sì, potete correggermi?
  8. 13-09-2011, 18.33.34 #8
    Guest

    Question

    Citazione Originalmente inviato da simpleticket Visualizza messaggio
    Se usi text-align, tutto sarà centrato (anche il contenuto del menu ...).
    Ma non vuole portare TUTTO il menu al centro?
    Se no, allora scusate, ho capito male!
  9. 13-09-2011, 18.34.33 #9
    Guest

    Predefinito

    Ma io vedo il menu centrato nella pagina.
  10. 13-09-2011, 18.38.17 #10
    Guest

    Predefinito

    Io su entrambi i computer, con risoluzioni divers vedo:

    E come puoi notare i margini del corpo del forum sono tagliati, e le voci stesse del menù non sono comunque ben centrate. D:

    (Anticipo un grazie ad entrambi comunque ;) )

    EDIT:

    Non si può agire sulle info di stile e caratteri?
    Ultima modifica di alemoppo : 13-09-2011 alle ore 20.41.07 Motivo: Usa il tasto "Edita"
  11. 13-09-2011, 18.43.24 #11
    Guest

    Predefinito

    Beh, puoi aggiungere una linea sotto il menu!
  12. 13-09-2011, 18.46.12 #12
    Guest

    Predefinito

    Come? :D

    EDIT:

    Ora sono riuscito a centrare le voci cambiando banalmente il valore width a 75.5, ora mi serve di non far tagliare i margini al menù.
    Ultima modifica di alemoppo : 13-09-2011 alle ore 20.41.50 Motivo: Usa il tasto "Edita"
  13. 13-09-2011, 18.53.47 #13
    Guest

    Predefinito

    Non scrivere due post di seguito!
    Comunque non eri riuscito a centrare già prima?

    Per linea intendo che metti una linea rossa sotto il menu così sembra che la pagina finisce lì.
  14. 13-09-2011, 18.58.37 #14
    Guest

    Predefinito

    Scusate per i post consecutivi.
    Cooomunque ho inserito una linea sotto il menù, ora pare più ordinato, se non fosse che appena ho inserito il codice dello stesso meù, si è ingrandito tutto il testo, come posso tenerlo fisso a, tipo 12px.
    E se proprio volete conquistare la mia adorazione (XD), come posso colorare lo sfondo della parte sopra la riga che ho inserito sotto il menù, di nero?
  15. 13-09-2011, 19.04.09 #15
    Guest

    Predefinito

    Prova a modificare lo stile in

    Codice HTML:
    <style>
  #box_esterno{
    width: 100%;
    background:url(images/bg.png) repeat-x top left;
  }
  #boxmenu{
    width: 75.5%; /*Lo adatti alle tue necessit�*/
    margin: auto;
  } 
</style>
    e il div in

    Codice HTML:
    <div id="box_esterno">
  <div id="boxmenu">
    <!-- Menu -->
  </div>
</div>
  16. 13-09-2011, 19.09.06 #16
    Guest

    Predefinito

    Come hai detto tu, simpleticket, non cambia nulla
  17. 13-09-2011, 19.12.44 #17
    Guest

    Predefinito

    Hai cambiato la parte del body ma non hai sistemato la parte dello stile.
  18. 13-09-2011, 19.18.40 #18
    Guest

    Predefinito

    Cambiata anche quella ma senza successo

    (Sto lavorando su una copia della home: http://criopera.altervista.org/PROVAindex.php )
    Ultima modifica di testpanco : 13-09-2011 alle ore 19.27.52
  19. 13-09-2011, 19.45.33 #19
    Guest

    Predefinito

    Scusa non avevo tenuto conto dei path

    Così dovrebbe andare:

    Codice HTML:
    <style>
  #box_esterno{
    width: 100%;
    background:url(menu/images/bg.png) repeat-x top left;
  }
  #boxmenu{
    width: 75.5%; /*Lo adatti alle tue necessit�*/
    margin: auto;
  } 
</style>
  20. 13-09-2011, 20.40.19 #20
    Guest

    Predefinito

    Ok, bene o male ci sono.
    E per la questione dei caratteri che in index sono diventati giganti?
    Preciso che l'index è in php come avrete visto, e io ho ficcato lo script del menu sopra tutto il codice php.
  21. 13-09-2011, 20.54.03 #21
    Guest

    Predefinito

    Citazione Originalmente inviato da criopera Visualizza messaggio
    Ok, bene o male ci sono.
    E per la questione dei caratteri che in index sono diventati giganti?
    Preciso che l'index è in php come avrete visto, e io ho ficcato lo script del menu sopra tutto il codice php.
    Si in effetti il codice è dove non dovrebbe essere.

    Prendi questo blocco

    Codice PHP:
    <div id="box_esterno">
    <    div id="boxmenu">
    <    ul class="menu red">
    <    li class="current"><a href="http://www.cri.it/flex/cm/pages/ServeBLOB.php/L/IT/IDPagina/1" target="_self">Sito CRI</a></li>
    <    li><a href="http://criopera.altervista.org/Pionieri.html" target="_self">Pionieri</a></li>
    <    li><a href="http://criopera.altervista.org/VdS.html" target="_self">VdS</a></li>
    <    li><a href="http://criopera.altervista.org/SezFemminile.html" target="_self">Sez. Femminile</a></li>
    <    li><a href="http://criopera.altervista.org/Capisquadra.html" target="_self">Capisquadra</a></li>

    <    li><a href="http://criopera.altervista.org/Mezzi.html" target="_self">Mezzi</a></li>
    <    li><a href="http://criopera.altervista.org/Servizi.html" target="_self">Servizi</a></li>
    <    li><a href="http://criopera.altervista.org/LaSede.html" target="_self">La sede</a></li>
    <    li><a href="http://criopera.altervista.org/Contatti.html" target="_self">Contatti</a></li>

    </    ul>
    </    div>
    </    div>

    <    hr>
    </    body>
    cancella quel </body>

    e mettilo subito dopo

    Codice PHP:
    <body class="ltr">

    <    a name="top"></a>
    Per i caratteri, apri il foglio

    /styles/RedSilver3/theme/stylesheet.css

    e modifica tutti gli elementi font-size. Potresti partire con un valore di "1em;" e poi aggiustare il tiro.
  22. 13-09-2011, 21.08.41 #22
    Guest

    Predefinito

    Santo Dio, praticamente devo andare a caso, quale sarà quello giusto? Mi divertirò parecchio... :D
    Grazie mille comunque
  23. 14-09-2011, 14.47.38 #23
    Guest

    Predefinito

    Hmm...modificando i valori di font-size, si modifica stranamente solo la grandezza dei caratteri del menù, e non quelli che costituiscono le parti testuale di index D:
    COme faccio?
     
  24. 14-09-2011, 15.00.22 #24
    Guest

    Predefinito

    devi modificare il file

    /styles/RedSilver3/theme/stylesheet.css

    se modifichi il file

    /menu/menu_style.css

    modifichi il menu.
  25. 14-09-2011, 15.16.28 #25
    Guest

    Predefinito

    Ok, ce l'ho fatta, ad eccezione della riga di navigazione utente (per intenderci quella che contiene: FAQ - 0 nuovi messaggi privati - Cerca - Iscritti - Pannello di Controllo Utente - Logout [ nomeutente ], "Segna come già letti" e le info sul template e il copyright in fondo), nonostante abbia cambiato tutti i parametri font-size in "12px", (perchè non rispondeva a "em")
« Discussione precedente | Prossima discussione »

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •  

Regole del forum