PDA

View Full Version : [Xhtml][css][javascript]nifty corners e angoli che non vengono arrotondati


Tokachu
07-09-2010, 18:28
spero di postare nella sezione giusta...

volevo aggiornare un po' il layout del sitarello che "gestisco", e mi sono ricapitati sotto mano dopo parecchio tempo i niftycorners, precisamente nella versione presente a questo indirizzo http://www.html.it/articoli/niftycube/index.html . (esempio 12 per essere ancora pių precisi)

ora stavo smanazzando un po' col codice, ma non mi stonda i bordi, e mi riduce l'altezza del footer. (come in figura)
http://img3.imagebanana.com/img/4jrunccs/thumb/Schermata.png (http://www.imagebanana.com/view/4jrunccs/Schermata.png)

questo il codice del file niftyLayout.js che ho modificato

/*nifty corners layout*/

window.onload=function(){
Nifty("div#menu","small transparent top");
Nifty("div#footer");
}
questo č il css, scusate la mancanza di commenti, ho fuso quello dell'esempio con quello preesistente e sto sistemando.

html,body{margin:10;padding:5}

body{font: 76% Verdana,Arial,sans-serif;text-align: center;background: #A0A0A0;padding-bottom:10px}

p{margin-top:0}

h1 {font-size: 200%;margin:0;padding:20px 0 0 20px;color: #000000;}

h2 {font-size: 140%;margin:0;padding:0 10px 0 10px;color: #000000;}

h3 {font-size: 115%;color: #000000;text-align: center;}

h4 {color: #000000;text-align: center;}

.titolo_menu {font-size: 105%;font-weight: bold;}

table {border: 0px;font: 96% Verdana,Arial,sans-serif;text-align: center;}

div#header{width:770px;margin:auto;overflow:hidden;background: #AD0000}
div#header h1,div#menu{width:770px;margin:0 auto;text-align:center}
div#header h1{padding: 36px 0 36px;font-size: 250%;color: #FFF}

ul#nav,ul#nav li{list-style-type:none;margin:0;padding:0}
ul#nav{float:right;font-size: 80%}
ul#nav li{float:left;margin-left: 2px;margin-right: 2px;text-align: center}
ul#nav a{float:left;width: 80px;padding: 5px 0;background: #990000;text-decoration:none;color: #FFFFFF}
ul#nav a:hover{background: #B1B1B1;color: #000030}
ul#nav li.activelink a,ul#nav li.activelink a:hover{background: #FFFFFF;color: #000030}

div#container{width:770px;margin:0 auto 10px;padding:10px 0 10px;background:#FFF}
div#content {float:left;display:inline;width:560px;margin:0 0 10px 10px;text-align: justify;}
div#content a{text-decoration: none;color: #770000;}

div#side{float:right;display:inline;width: 180px;background:#AD0000; margin:0 10px 10px 0;text-align:center;}
div#side p{margin:5px 0 10px;padding: 0 10px}
div#side div{margin: 0 0 10px;padding: 10px 0}
div#side a{text-decoration: none;color: #FFFFFF;}

div#footer{clear:both;width:750px;margin:0 10px 0;padding: 10px 0;background: #AD0000;color: #FFF;text-align:center}
div#footer p{margin:0}
ora, per me anche se non stonda il footer o il resto non č un problema (mi va bene anche cosė), ma almeno il menu in alto sarebbe gentile da parte sua.
ci sto sbattendo la testa da un po' ma devo essere talmente arrugginito da non capire cosa ci sia che non va.
avete idee? (a parte l'header che non mi convince )
grazie.

Tokachu
08-09-2010, 01:15
credo di aver risolto con una soluzione rozza...
ho incorporato il contenuto di niftyCorners.css (presente nei download del link) nel css richiamato nel codice xhtml e ha preso a funzionare.

se avete soluzioni pių eleganti da suggerire non vi fate scrupoli.