- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- Spostare layout a centro pagina
-
Spostare layout a centro pagina
Buongiorno a tutti, all'indirizzo pk.siissoft.it/home1.php c'è la pagina che vorrei posizionare al centro dello schermo, essendo ora tutta spostata sulla sinistra. Inoltre a differenza di quanto avviene in Mozilla, Safari e Opera con IE il riquadro al centro contenente il testo non viene visualizzato per niente.
Questo il codice del CSS/***** Body and main container *****/ body { margin:0 auto; padding:0; font:76% Verdana,Tahoma,Arial,sans-serif; background:#eaeaea url(img/sfondo.jpg) repeat-x; color:#3a3a3a; } #wrap { background-image:url(img/sfondo_pagina.jpg); color:#303030; width:900px; border-style:solid; border-width:1px; border-color:#7E7E7E; } /***** Header *****/ #header { width:900px; height:200px; color:#505050; background-color:trasparent; background-image:url(img/sfondo_header.jpg); background-repeat:no-repeat; /*background:#ffffff url(img/sfondo_header.jpg) top left no-repeat;*/ margin:0px 0 0px 0; padding:0; } #header_ul { width:500px; display:block; position:absolute; top: 110px; left: 570px; padding:0; margin:0 } #header_ ul.navi li{ background: url(img/separation.gif) no-repeat left; height: 24px; padding: 0 0px 0 0px; margin: 0; display: block; float: left; } ul.navi li a{ font: 14px/21px Arial, Helvetica, sans-serif; text-decoration: none; text-indent: 0px; padding: 0 0 0 33px; font-weight: normal; margin: 0; background-image: url(img/button.jpg); } .navi li a:hover { font: 13px/21px Verdana; color: #FFFF99; text-decoration: none; background-repeat: no-repeat; background-image: url(img/button_hover.jpg); } p { font-size:1.1em; letter-spacing:-1px; margin:0 0 20px 15px; padding:0 0 0 3px; } /***** Left sidebar *****/ #avmenu { position:relative; clear:left; float:left; width:150px; margin:0 0 10px 0; padding:0 0 0px 15px; float:left; } ul { list-style:none; width:150px; margin:0 0 20px 0; padding:0; } .riquadro { background:url(img/riquadro_pulsanti.jpg) center no-repeat; height: 235px !important; /* for IE5 and IE6 in quirks mode */ height /**/:235px; /* for IE6 in standards mode */ margin: 1px 0 1px 0; text-align: center; width: 134px !important; /* for IE5 and IE6 in quirks mode */ width /**/:134px; /* for IE6 in standards mode */ } .riquadro_links { background:url(img/riquadro_links.jpg) center no-repeat; height: 235px !important; /* for IE5 and IE6 in quirks mode */ height /**/:235px; /* for IE6 in standards mode */ margin: 1px 0 1px 0; text-align: center; width: 134px !important; /* for IE5 and IE6 in quirks mode */ width /**/:134px; /* for IE6 in standards mode */ } li { margin-bottom:5px; } li a { font-weight:bold; height:20px; text-decoration:none; color:#505050; display:block; padding:6px 6px 0px 10px; } li a:hover, li a.current { color:#505050; } ul ul { margin:5px 0 5px 15px; font-size:0.9em; width:135px; } ul ul a { height:16px; margin:0; padding:4px 0 0 8px; } h2 { font-size:1.5em; font-weight:normal; } /***** Right sidebar *****/ #extras { float:right; width:130px; margin:0 0 10px 0; padding:0; font-size:0.9em; } p, ul { margin:0 0 1.5em 0; line-height:1.3em; padding:0; } a { font-weight:bold; } li { list-style:none; margin:0 0 6px 0; padding:0; } h2 { font-size:1.6em; font-weight:normal; margin:0 0 6px 0; ; letter-spacing:-1px; } /***** Main content *****/ #content { margin:0px 125px 10px 160px; padding:0; line-height:1.5em; text-align:left; } #contentwide { margin:3px 18px 0 160px; padding:0px; line-height:1.5em; text-align:left; border-style:solid; border-width:1px; border-color:#7E7E7E; } #contentfull { margin:10px 10px 10px 10px; padding:2px 0 0 0; line-height:1.5em; text-align:left; } h2, h2, h2 { font-size:1.8em; letter-spacing:-1px; font-weight:normal; margin:8px 0 10px 0; padding:0; } h3, h3, h3 { font-size:1.5em; font-weight:normal; margin:6px 0 6px 0; padding:0; } img, img, img { padding:1px; display:inline; background:#cccccc; color:#303030; border:4px solid #f0f0f0; } a, a, a { font-weight:bold; } ul, ol, ul, ol, ul, ol { margin:0 0 16px 20px; padding:0; } ul ul, ol ol, ul ul, ol ol, ul ul, ol ol { margin:2px 0 2px 20px; } li, li, li { margin:0 0 2px 10px; padding:0 0 0 4px; } /***** Footer *****/ #footer { clear:both; margin:0 auto; padding:4px 0px 4px; border-top:1px solid #7E7E7E; width:900px; text-align:center; color:#808080; background-color:#ffffff; font-size:0.9em; } p { padding:0 margin:0; } a { color:#808080; background-color:inherit; text-decoration:none; } a:hover { text-decoration:underline; } /***** Various tags *****/ a { text-decoration:none; color:#ffffff; background-color:inherit; } a:hover { text-decoration:none; color:#286ea0; background-color:inherit; } a img { border:0; } p { margin:0 0 16px 0; } blockquote { border-top:1px solid #d8d8d8; border-right:1px solid; border-bottom:1px solid; border-left:4px solid #cccccc; margin:16px; padding:7px 7px 7px 11px; background:#f4f4f4 url(img/menubg.gif) bottom left repeat-x; color:#505050; } blockquote p { font-size:1.1em; line-height:1.3em; margin:0; } /***** Table styles *****/ table { margin:0 0 0px 0; padding:0; line-height:1.3em; border-collapse:collapse; } caption { text-align:left; font-size:1.5em; font-weight:normal; margin:0; padding:6px 0 8px 0; } th { padding:0px; text-align:left; } td { padding:0px; width:110px; height:24px; font-size:0.9em; text-align:center; background:url(img/sfondo_tabella.jpg) no-repeat; } /***** Form styles *****/ .button { border-top:1px solid; border-right:1px solid; border-bottom:1px solid; border-left:4px solid; margin:0 0 15px 0; padding:7px 7px 7px 11px; background:#f4f4f4 url(img/menubg.gif) bottom left repeat-x; color:#505050; font-weight:bold; width:120px; } input, textarea { border:1px solid; font-family:Verdana,Tahoma,Arial,Sans-Serif; font-size:1em; margin:0; padding:4px; } label { margin:2px; } input { width:200px; } textarea { width:400px; } /***** Search box *****/ #searchbox { padding:0; margin:6px 0 16px 0; } #searchform { background:#ffffff; border:1px solid; color:#505050; font-size:0.9em; padding:4px; width:116px; } label { display:none; } /***** Various classes *****/ .left { margin:10px 10px 5px 0; float:left; } .right { margin:10px 0 5px 10px; float:right; } .announce { margin:10px 0 10px 0; padding:10px 10px 5px 10px; width:105px; color:#505050; background:url(img/menubg.gif) bottom left repeat-x; border-top:1px solid; border-right:1px solid; border-bottom:1px solid; border-left:4px solid; line-height:1.3em; } .announce a { font-weight:bold; } .announce p { font-size:0.9em; } .announce h2 { margin:0 0 10px 0; padding:0; } .announce { width:125px; } .textright { text-align:right; margin:-10px 0 4px 0; } .center { text-align:center; } .small { font-size:0.8em; } .large { font-size:1.3em; } .bold { font-weight:bold; } .highlighted { padding:3px; background-color:#f0f0f0; color:#303030; border:1px solid #b0b0b0; } .hide { display:none; } /* gabriele */ #botton{ width: 500px; height:75px; position:absolute; margin-left:330px; margin-top:126px; font-family:Tahoma; color:#FFFFFF; BACKGROUND-COLOR:trasparent; float:left; } #bot{ width: 110px; height:75px; position:relative; margin-left:10px; margin-top:0px; font: 13px/21px Verdana; color:; text-align:center; padding-top:2px; color:#CCCCCC; BACKGROUND-COLOR:trasparent; background-image:url(img/sfondo_tabella.jpg); background-repeat:no-repeat; float:left; } #bot_{ width: 110px; height:75px; position:relative; margin-left:10px; margin-top:0px; font: 13px/21px Verdana; color:; text-align:center; padding-top:2px; color:#CCCCCC; BACKGROUND-COLOR:trasparent; background-image:url(img/sfondo_tabella_.jpg); background-repeat:no-repeat; float:left; } a { font: 13px/21px Verdana; color:; text-align:center; padding-top:2px; color:#003366; text-decoration:none; } a.menu { font: 13px/21px Verdana; color:; text-align:center; padding-top:2px; color:#CCCCCC; text-decoration:none; } a.menu:hover { font: 13px/21px Verdana; color:; text-align:center; padding-top:2px; color:#FF0000; text-decoration:none; } { width: 591px; height:490px; position:absolute; margin-left:300px; margin-top:0px; BACKGROUND-COLOR:trasparent; background-image:url(img/sfondo_content.jpg); float:left; } #content_box{ width: 500px; height:400px; position:absolute; margin-left:45px; margin-top:45px; BACKGROUND-COLOR:#FFFFFF; float:left; overflow:auto; }
Grazie in anticipo a chiunque vorrà darmi un consiglio
Buon weekend
-
Chiudo per doppio post.