Visualizzazione dei risultati da 1 a 7 su 7
  1. #1
    Utente di HTML.it
    Registrato dal
    Dec 2007
    Messaggi
    82

    background sovrappone elementi su i.e. 9

    Ciao ragazzi,
    ho questa pagina di prova
    che su mozilla 3.6 e su chrome si vede correttamente, mentre su i.e. 9 dopo un secondo dove si vede bene, l'immagine di background sovrappone tutti gli elementi che dovrebbero stare in primo piano:

    Vi viene in mente qualcosa? sto esaurendo!!

    Qua il css:

    codice:
    /* Getting the new tags to behave */
    
    article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
    mark, rp, rt, ruby, summary, time{ display: inline }
    
    /* Global properties ======================================================== */
    body { 
    	background:url(../images/body-bg.gif) 50% 0 #adbac2; 
    	font-family:Arial, Helvetica, sans-serif;
    	font-size:100%; 
    	line-height:1.125em;
    	color:#96a3aa;
    }
    html { min-width:960px;}
    html, body { height:100%;}
    
    /* Global Structure ============================================================= */
    .container {
    	margin: 0 auto;
    	position: relative;
    	width: 960px;
    	font-size:.8125em;
        top: 0px;
        left: 0px;
    }
    
    .menunav {
    	margin: 0 auto;
    	position: relative;
    	width: 960px;
    	font-size:.8125em;
    	top: 0px;
        left: 0px;
    }
    
    	/* Header */
    	header{
    		height:300px;
    		overflow:hidden;
    		background:url(../images/header-tail.gif) 50% 0 repeat-x;
    	}
    	
    	/* Content */
    	section#content {
    		position:relative;
    		z-index:3;
    	}
    		section#content .container {
    			background:#fff;
    		}
    			section#content .inside {
    				padding:20px 20px 65px 20px;
    			}
    	
    	/* Content-HOME */
    	section#contenthome {
    		position:relative;
    		z-index:3;
    	}
    		section#contenthome .container {
    			background:#fff;
    		}
    			section#contenthome .inside {
    				padding:20px 20px 20px 20px;
    			}	
    				
    	/* Footer */
    	footer{
    		padding:0 0 83px 0;
    	}
    		footer .container {
    			background:#3b4043;
    			border-radius:12px;
    			-moz-border-radius:12px;
    			-webkit-border-radius:12px;
    			font-size:10px;
    			text-transform:uppercase;
    			color:#6d777b;
    			position:relative;
    			margin-top:-10px;
    			behavior: url(js/PIE.htc);
    		}
    			footer .inside {
    				padding:28px 20px 20px 40px;
    			}
    
    
    
    /* Left & Right alignment */
    
    .fleft { float:left;}
    .fright { float:right;}
    .clear { clear:both;}
    
    .col-1, .col-2, .col-3, .col-4 { float:left;}
    .colborder {border-right:1px solid #dedede;}
    
    .alignright { text-align:right;}
    .aligncenter { text-align:center;}
    .aligngiustificato { text-align: justify; }
    
    .wrapper { 
    	width:100%;
    	overflow:hidden;
    }
    
    /* The inside class provides consistent padding. To be used often! */
    .inside{ padding: 20px; }
    
    
    /*----- form defaults -----*/
    input, select, textarea { 
    	font-family:Arial, Helvetica, sans-serif;
    	font-size:1em;
    	vertical-align:middle;
    	font-weight:normal;
    }
    
    /*----- other -----*/
    figure img { 
    	margin:0 25px 0 0; 
    	float:left;
    	border:4px solid #d2d9dd;
    }
    figure img.noborder {
    	border:none;
    }
    .img-box { 
    	width:100%; 
    	overflow:hidden; 
    	padding-bottom:20px;
    }
    
    .extra-wrap { 
    	overflow:hidden;
    }
    
    p {margin-bottom:18px;}
    .p1 { margin-bottom:9px;}
    .p2 { margin-bottom:18px;}
    .p3 { margin-bottom:27px;
    }
    
    
    /*----- txt, links, lines, titles -----*/
    a {
    	color:#3a3a3a; 
    	outline:none;
    }
    a:hover{
    	text-decoration:none;
    }
    
    h1 {
    	font-size:36px;
    	line-height:1.2em;
    	text-transform:uppercase;
    }	
    h1 a {
    		color:#fff;
    		text-decoration:none;
    		font-style:italic;
    		text-shadow:1px 1px 0 #922e02;
    	}
    h1 a span {
    		font-weight:normal;
    	}
    h2 {
    	font-size:24px;
    	font-weight:normal;
    	line-height:1.2em;
    	color:#3a3a3a;
    	font-style:italic;
    	margin-bottom:22px;
    }
    h3 {
    	font-size:20px;
    	line-height:1.2em;
    	color:#3a3a3a;
    	font-weight:normal;
    	font-style:italic;
    	position:relative;
    	border-bottom:1px solid #dedede;
    	padding:13px 0 5px 0;
    	margin-bottom:7px;
    	width:100%;
    }
    h3 img {
    		position:absolute;
    		right:0;
    		top:0;
    	}
    h4 {
    	font-size:1em;
    	color:#3a3a3a;
    	margin-bottom:18px;
    	padding-top:8px;
    }
    h5 {
    	font-size:1em;
    	color:#3a3a3a;
    	margin-bottom:18px;
    }
    h6 {
    	font-size:1em;
    	color:#3a3a3a;
    }
    
    
    mark {color:#3a3a3a; font-weight:bold;}
    
    
    .more-link {
    	background:url(../images/bull-3.gif) no-repeat 100% 8px;
    	padding-right:7px;
    	color:#061d31;
    	font-weight:bold;
    	text-decoration:none;
    }
    .more-link:hover {
    	text-decoration:underline;
    }
    
    .button
    {
        display: inline-block;
        padding: 5px 10px;
        font-size: 11px;
        text-transform: uppercase;
        color: #FFFFFF;
        background: #AA0303;
        text-decoration: none;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #5e5e5e),color-stop(1, #AA0303)); /* FF3.6 */ /* Saf4+, Chrome */
        -pie-background: linear-gradient(#5e5e5e, #AA0303 70%);
        behavior: url(js/PIE.htc);
        position: relative;
        font-weight: bold;
    }
    .button:hover {
    	background-image: -moz-linear-gradient(top, #AA0303, #5e5e5e); /* FF3.6 */
    	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #AA0303),color-stop(1, #5e5e5e)); /* Saf4+, Chrome */
    	-pie-background: linear-gradient(#383838, #AA0303 70%);
    }
    
    
    /*==================boxes====================*/
    .box {
    	background:#f0f3f5;
    	padding:21px 16px 36px 14px;
    	border:1px solid #e0e8ed;
    	border-radius:6px;
    	-moz-border-radius:6px;
    	-webkit-border-radius:6px;
    	behavior: url(js/PIE.htc);
    	position:relative;
    }
    
    .box .inner {
    		padding:0 15px 0 15px;
    	}
    
    .address { 
    	float:left;
    }
    .address dt {
    		margin-bottom:18px;
    	}
    .address dt:first-line {
    		font-weight:bold;
    		color:#3a3a3a;
    	}
    .address dd { 
    		clear:both;
    	}
    .address dd span { 
    			float:left;
    			width:82px;
    		}
    .address dd a {
    			color:#3a3a3a;
    		}
    blockquote {
    	font-style:italic;
    	color:#95a2a9;
    	background:url(../images/quotes.gif) no-repeat 5px 5px;
    	display:block;
    	margin-bottom:12px;
    }
    
    
    /*===== header =====*/
    header nav
    {
        position: absolute;
        left: 0;
        top: 10px;
        width: 960px;
        height: 140px;
        border-radius: 24px;
        -moz-border-radius: 24px;
        -webkit-border-radius: 24px;
        behavior: url(js/PIE.htc);
        background: #DDC64A; /* Opera */
        background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #DDA04A),color-stop(1, #DDC64A)); /* FF3.6 */ /* Saf4+, Chrome */
        -pie-background: linear-gradient(#DDA04A, #DDC64A 70%); 
        
        /* background:url(images/header.jpg) no-repeat; /* Opera */
        /* background-image: url(images/header.jpg) no-repeat; /* FF3.6 */ 
        /* background-image: url(images/header.jpg) no-repeat; /* Saf4+, Chrome */ 
        /* -pie-background: url(images/header.jpg) no-repeat;*/
        
        overflow: hidden;
        z-index: 1;
    }
    
    header .logo {
    	position:absolute;
    	left:10px;
    	top:10px;
    }
    
    header .logo strong {
    		display:block;
    		font-size:10px;
    		text-transform:uppercase;
    		color:#571b00;
    		margin-top: 5px;
    		padding-left:0px;
    	}
    
    .slider {
    	background:#fff;
    	width:960px;
    	height:170px;
    	left:0;
    	top:130px;
    	position:absolute;
    	z-index:2;
    	padding-top:1px;
    }
    
    
    /*===== content =====*/
    #content article {
    	border-bottom:1px solid #dedede;
    	padding-bottom:30px;
    	margin-bottom:30px;
    }
    #content article.last {
    	border-bottom:none;
    	padding-bottom:0;
    	margin-bottom:0;
    }
    #content .indent {
    	padding:32px 5px 0 21px;
    }
    	#content .indent .indent {
    		padding:0 0 40px 0;
    	}
    	
    	.list1 {
    		margin-bottom:14px;
    	}
    		.list1 li {
    			border-bottom:1px solid #dedede;
    			font-size:12px;
    			color:#6a7e88;
    			padding:0 0 6px 0;
    			margin-bottom:7px;
    		}
    			.list1 li a {
    				color:#5ac1e0;
    				text-decoration:none;
    			}
    			.list1 li a:hover {
    				color:#000;
    				text-decoration:underline;
    			}
    	
    	.list2 {
    		padding-bottom:10px;
    	}
    		.list2 li {
    			background:url(../images/arrow1.gif) no-repeat 0 0;
    			padding:1px 0 3px 32px;
    			margin-bottom:10px;
    			position:relative;
    		}
    			.list2 li a {
    				color:#96a3aa;
    			}
    	
    	.list3 {
    		padding-bottom:10px;
    	}
    		.list3 li {
    			background:url(../images/arrow1.gif) no-repeat 0 0;
    			padding:1px 0 3px 32px;
    			margin-bottom:10px;
    			position:relative;
    		}
    			.list3 li a {
    				color:#2F3324;
    			}
    
    /*===== footer =====*/
    
    footer a {
    	color:#6d777b;
    	text-decoration:none;
    }
    footer a:hover {
    	color:#fff;
    }
    
    footer span {
    	color:#d4d4d4;
    }
    
    
    /*----- forms -----*/
    #search-form
    {
        position: absolute;
        right: 25px;
        top: 25px;
        z-index: 30;
    }
    	#search-form fieldset {
    		border:none;
    		display:inline;
    	}
    	#search-form input.text
    {
        width: 300px;
        background: #ECEFCE;
        padding: 5px 8px 6px 20px;
        border: 2px solid #b8c7cf;
        border-radius: 14px;
        -moz-border-radius: 14px;
        -webkit-border-radius: 14px;
        color: #b6c3ca;
        margin-right: 10px;
        behavior: url(js/PIE.htc);
        display: block;
        float: left;
        position: relative;
        margin-top: 30px;
    }
    	#search-form input.submit
    {
        font-size: 12px;
        text-transform: uppercase;
        font-weight: bold;
        color: #FFFFFF;
        background: #AA0303;
        border: none;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #5e5e5e),color-stop(1, #AA0303)); /* FF3.6 */ /* Saf4+, Chrome */
        -pie-background: linear-gradient(#5e5e5e, #AA0303 70%);
        width: 55px;
        height: 27px;
        behavior: url(js/PIE.htc);
        cursor: pointer;
        display: block;
        float: left;
        position: relative;
        margin-top: 30px;
        margin-right: 10px;
    }
    
    #contacts-form fieldset {
    	border:none;
    	width:100%;
    	overflow:hidden;
    	display:block;
    }
    	#contacts-form .col-1 {
    		width:290px !important;
    		margin-right:0 !important;
    	}
    	#contacts-form .col-2 {
    		width:290px !important;
    		margin-right:0 !important;
    	}
    	#contacts-form label {
    		display:block;
    		height:54px;
    		overflow:hidden;
    	}
    		#contacts-form input {
    			color:#111;
    			border:1px solid #a4a4a4;
    			background:none;
    			padding:3px 0 3px 5px;
    			width:235px;
    		}
    		#contacts-form textarea {
    			color:#111;
    			border:1px solid #a4a4a4;
    			background:none;
    			padding:3px 0 3px 5px;
    			width:280px;
    			overflow:auto;
    			height:177px;
    			margin-bottom:18px;
    		}
    		#contacts-form .button {
    			float:right;
    			margin-left:20px;
    		}
    
    /*==========================================*/

  2. #2
    ma questo css appartiene a qualche template già fatto o l'hai generato con qualche programma ?

  3. #3
    Utente di HTML.it
    Registrato dal
    Dec 2007
    Messaggi
    82
    template già fatto.

    Infatti anche nella sua forma originale (io l'ho modificato poco),
    ha lo stesso problema.

  4. #4
    è molto strano che anche l'originale non funzioni....
    puoi dirmi come si chiama ?

  5. #5
    Utente di HTML.it
    Registrato dal
    Dec 2007
    Messaggi
    82
    Non saprei me l'hanno fornito.
    Però posso linkartelo, visto che l'ho pubblicato su uno spazio, ma non so se è consentito dal forum fare abuso di link.

  6. #6
    questo non lo so neanche io...
    in mp ??
    perchè è strano come css... sicuramente è stato generato con qualche software...

  7. #7
    Utente di HTML.it
    Registrato dal
    Sep 2001
    Messaggi
    21,188
    ma non so se è consentito dal forum fare abuso di link.
    questo non lo so neanche io...
    Questi dubbi si risolvono consultando il regolamento (e forum diversi hanno regole leggermente diverse).
    In questo forum si possono postare link, strettamente necessari per spiegare un concetto, un esempio.

    NON si possono postare link per fare spamming e/o a siti pornografici, che incitano a violenza o altre pratiche fraudolente.
    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 © 2026 vBulletin Solutions, Inc. All rights reserved.