Visualizzazione dei risultati da 1 a 2 su 2

Discussione: Problema pulsanti

  1. #1

    Problema pulsanti

    Recentemente ho scaricato dal sito lo script Una semplice interfaccia per creare wizard.
    Questo è il CSS (non fate caso ai commenti, è una cosa per la scuola )
    codice:
    .wiz-container { 				/* Contenitore interfaccia */
    	width: 100%;				/* Larghezza */
    	height: 100%;				/* Altezza */
    	left: 5%;					/* Sinistra */
    	right: 5%;					/* Destra */
    	top: 50px;					/* Sopra */
    	margin: 1px;				/* Margine */
    	background: #F8F8F8;		/* Colore di sfondo */
    	overflow: hidden;			/* Superare i limiti di altezza */
    	border: #E0E0E0 solid 1px;	/* Bordo */
    	padding: 0;					/* Spaziatura (12px 0px 2px 5px;) */    
    	color: #0464BB;				/* Colore del testo */
    	text-align: left;			/* Allineamento del testo */
    	-moz-border-radius: 8px;	/* Curvatura degli angoli Firefox */
    	-webkit-border-radius: 8px;	/* Curvatura degli angoli Chrome */
    	z-index: 100;				/* Piano in cui è disposto */
    }
    .wiz-container ul {				/* Lista contenitori fasi */
    	list-style: none; 					/* Stile lista */
    	padding: 3px ; 						/* Spaziatura */
    	display: block;						/* Tipo di stile elemento */
    	background: #F8F8F8;				/* Colore di sfondo */
    	height: 72px;						/* Altezza */
    	margin-left: 3px;					/* Margine sinistro */
    	margin-right: 3px;					/* Margine destro */
    	border-bottom: 1px solid #E0E0E0;	/* Margine inferiore */
    }
    .wiz-container ul li{ 			/* Titolo fasi */
    	float: left; 						/* Posizionamento */
    	border-bottom-width: 0 !important;	/* Larghezza bordo inferiore */ 
    	margin: 0; 							/* Margine */
    	margin-right: 2px;					/* Margine destro */
    	padding: 0; 						/* Spaziatura */
    }
    .wiz-container ul li a { 		/* Link titolo fasi */			
    	display: block;			/* Stile display */
    	text-decoration: none;	/* Decorazione del testo */
    	padding-left: 3px;		/* Spaziatura sinistra */
    	height: 71px;			/* Altezza */
    	width: 147px;				/* Larghezza */
    	color: #0464BB;			/* Colore del testo */
    }
    .wiz-container ul li a:hover {  /* Link già cliccati titolo fasi */ 
    	color: #0464BB;	/* Colore del testo */ 
    }
    .wiz-anc-default{				/* Fase di default */
    	background-color: #EBEBEB;				 	/* Colore di sfondo */
    	border: #E0E0E0 solid 1px; 					/* Bordo */
    	-moz-border-radius-bottomright: 25px;		/* Curvatura bordo inferiore destro Firefox */
    	-moz-border-radius-topright: 25px;			/* Curvatura bordo superiore destro Firefox */
    	-moz-border-radius-bottomleft: 2px;			/* Curvatura bordo inferiore sinistro Firefox */
    	-moz-border-radius-topleft: 2px; 			/* Curvatura bordo superiore sinistro Firefox */
    	-webkit-border-top-left-radius: 2px;		/* Curvatura bordo superiore sinistro Chrome */
    	-webkit-border-bottom-left-radius: 2px;		/* Curvatura bordo inferiore sinistro Chrome */
    	-webkit-border-top-right-radius: 20px;		/* Curvatura bordo superiore destro Chrome */
    	-webkit-border-bottom-right-radius: 20px;	/* Curvatura bordo inferiore destro Chrome */    
    }
    .wiz-anc-current{				/* Fase selezionata */
    	color: #FFF !important; 					/* Colore del testo */
    	background-color: #EA8511;					/* Colore di sfondo */
    	border: #EA8511 solid 1px;					/* Bordo */
    	-moz-border-radius-bottomright: 25px;		/* Curvatura bordo inferiore destro Firefox */
    	-moz-border-radius-topright: 25px;			/* Curvatura bordo superiore destro Firefox */
    	-moz-border-radius-bottomleft: 2px;			/* Curvatura bordo inferiore sinistro Firefox */
    	-moz-border-radius-topleft: 2px; 			/* Curvatura bordo superiore sinistro Firefox */
    	-webkit-border-top-left-radius: 2px;		/* Curvatura bordo superiore sinistro Chrome */
    	-webkit-border-bottom-left-radius: 2px;		/* Curvatura bordo inferiore sinistro Chrome */
    	-webkit-border-top-right-radius: 20px;		/* Curvatura bordo superiore destro Chrome */
    	-webkit-border-bottom-right-radius: 20px;	/* Curvatura bordo inferiore destro Chrome */
    }
    .wiz-anc-done{					/* Fase finale */
    	color: #FFF !important; 					/* Colore del testo */
    	background-color: #0464BB;					/* Colore di sfondo */
    	border: #0464BB solid 1px;					/* Bordo */
    	-moz-border-radius-bottomright: 25px;		/* Curvatura bordo inferiore detro Firefox */
    	-moz-border-radius-topright: 25px;			/* Curvatura bordo superiore detro Firefox */
    	-moz-border-radius-bottomleft: 2px;			/* Curvatura bordo inferiore sinistro Firefox */
    	-moz-border-radius-topleft: 2px; 			/* Curvatura bordo superiore sinistro Firefox */
    	-webkit-border-top-left-radius: 2px;		/* Curvatura bordo superiore sinistro Chrome */
    	-webkit-border-bottom-left-radius: 2px;		/* Curvatura bordo inferiore sinistro Chrome */
    	-webkit-border-top-right-radius: 20px;		/* Curvatura bordo superiore destro Chrome */
    	-webkit-border-bottom-right-radius: 20px;	/* Curvatura bordo inferiore destro Chrome */
    }
    .wiz-body{						/* Contenuto fase */
    	display: block; 					/* Stile display */
    	background: transparent; 			/* Colore di sfondo */
    	border-bottom: 0px solid #E0E0E0;	/* Bordo inferiore */
    	width: auto;						/* Larghezza */
    }
    .wiz-body div.wiz-content {		/* Contenitore principale contenuto */
    	display: block; 					/* Stile display */
    	top: 0px;							/* Sopra */
    	left: 0px;							/* Sinistra */
    	text-decoration: none; 				/* Decorazione */
    	padding: 3px;						/* Spaziatura */
    	margin : 3px;						/* Margine */
    	border-bottom: 0px solid #E0E0E0;	/* Bordo inferiore */
    	height: 100%;						/* Altezza */
    	width: 100%;						/* Larghezza */
    	overflow: auto;						/* Posizionamento assoluto */
    }
    .wiz-nav {						/* Navigazione */
    	display: block;					/* Stile display */ 
    	left: 0px;						/* Sinistra */
    	bottom: 0px;					/* Sotto */
    	text-decoration: none; 			/* Decorazione testo */
    	padding: 2px 5px 2px 5px;		/* Spaziatura */
    	background: #F8F8F8 ; 			/* Colore di sfondo */
    	height: 30px;					/* Altezza */
    	width: 99%;						/* Larghezza */
    	margin : 0px 0px 0px 0px;		/* Margine */
    	border: 0px solid #E0E0E0;		/* Bordo */
    	border-top: 1px solid #E0E0E0;	/* Bordo superiore */
    }
    .wiz-nav #next {				/* Fase seguente */
    	float: right;	/* Posizionamento */
    }
    .wiz-nav #back{					/* Fase precedente */
    	float: left;	/* Posizionamento */
    }
      
    /* STILE PULSANTI INTERFACCIA */
    .btn{							/* Pulsanti */
    	width: 100px;				/* Larghezza */
    	-moz-border-radius: 8px;	/* Curvatura bordo Firefox */
    	-webkit-border-radius: 8px;	/* Curvatura bordo Chrome */
    	background: #5A5655;		/* Colore di sfondo */
    	color: #FFFFFF;				/* Colore del testo */
    	margin: 0px 10px 0px 10px;	/* Margine */
    	padding: 5px 5px 5px 5px;	/* Spaziatura */
    	text-align: center;			/* Allineamento del testo */
    	border: 1px solid #5A5655;	/* Bordo */
    	text-decoration: none; 		/* Decorazione del testo */
    }
    .btn:hover{						/* Pulsanti cliccati */
    	background: #EA8511;		/* Colore di sfondo */
    	color: #FFFFFF;				/* Colore del testo */
    	border: 1px solid #EA8511;	/* Bordo */ 
    	text-decoration: none;		/* Decorazione del testo */ 
    }
    Vorrei adattare i pulsanti degli step, evidenziati nell'immagine allegata, alle possibili risoluzioni di un monitor. Per favore, rispondete velocemente, ho pochissimo tempo per consegnare il tutto e se non lo finisco prenderò un brutto voto e addio gita.

  2. #2
    Utente di HTML.it
    Registrato dal
    Sep 2001
    Messaggi
    21,188
    Non possiamo "fare i compiti" per un altro.

    Il problema potrebbe essere interessante, ma posto in questi termini viola il regolamento generale del forum.

    E considera cosa potrebbe succedere se il prof (o chi per lui) venisse a conoscenza di questa domanda ... (ricordo che questo e` un forum pubblico, indicizzato anche dai motori di ricerca)
    Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
    No domande tecniche in messaggi privati

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.