Salve ragazzi,
ho un problema con la visualizzaione di un template su explorer:
www.carmelobrischetto.it/teatro10Se notate, firefox lo visualizza perfettamente, invece explorer fa casino con i div in alto.
Qualcuno di voi sa il perché???
Inoltre vorrei spostare il menù orizzontale grande un po' a sinistra, ma sembra che dimentichi qualcosa...
Ecco il codice html:
<!--
<?php
/**
* @copyright Copyright (C) 2005 - 2007 Open Source Matters. All rights reserved.
* @license GNU/GPL, see LICENSE.php
* Joomla! is free software. This version may have been modified pursuant
* to the GNU General Public License, and as distributed it includes or
* is derivative of works licensed under the GNU General Public License or
* other free or open source software licenses.
* See COPYRIGHT.php for copyright notices and details.
*/
// no direct access
defined( '_JEXEC' ) or die( 'Restricted access' );
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/nautilus/css/template.css" type="text/css" />
<meta name="author" content="Kai Gossel">
<link href="css/template.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
<div id="brand" style="width:150px"><ul id="brand2"><jdoc:include type="modules" name="user1" /></ul></div>
<div id="orientationbar">
<div class="breadcrumbs"><p><strong><jdoc:include type="modules" name="breadcrumb" style="1" /></strong></p> </div>
<div></div>
</div>
<?php if($this->params->get('useSearch')) : ?><div class="search"><jdoc:include type="modules" name="user4" style="-1" /></div><?php endif; ?><div class="clear"></div>
<div id="header">
<div class="nav"><ul id="navbarlist"><jdoc:include type="modules" name="nav" /></ul></div>
</div>
<div id="body"><jdoc:include type="modules" name="user3" /></div>
<div id="content">
<div id="sidebarcontent">
<jdoc:include type="modules" name="left" style="bootDivision" />
</div>
<div id="maincontent">
<jdoc:include type="component" />
</div>
<div class="clear"></div>
</div>
<div id="footer-menu">
<div class="nav"><jdoc:include type="modules" name="user4" /></div>
<div id="footer"><div class="nav"><ul id="footermenulist2"><jdoc:include type="modules" name="footer" /></ul></div>
</div>
</div>
</div>
</div><jdoc:include type="modules" name="debug" /></div>
</body>
</html>
Ed ecco il css:
/*****************************/
/*****************************/
html {
height: 100%;
margin-bottom: 1px;
}
form {
margin: 0;
padding: 0;
}
body {
background: #FFFFFF url(../images/body_bg.jpg) top center no-repeat;
font-family: Helvetica,Arial,sans-serif;
line-height: 1.1em;
margin: 0px 0px 0px 0px;
padding:0px 0px 6px 0px;
font-size: 12px;
color: #333;
}
menualto {
padding: 12px;
}
a:link, a:visited {
text-decoration: none;
font-weight: normal;
}
a:hover {
text-decoration: underline;
font-weight: normal;
}
input.button { cursor: pointer; }
p { margin-top: 0; margin-bottom: 5px; }
img { border: 0 none; }
strong {
font-weight:bold;
font-size: 13px;
}
brand {
padding-left:95px;
}
.clear {
clear:both;
font-size: 12px;
}
/*****************************/
/*** Layout ***/
/*****************************/
#wrapper {
margin: 120px auto 0 auto;
width: 996px;
position:absolute;
left:13.2%;
}
#topnavbar {
clear:both;
height: 45px;
margin: 0;
padding: 8px 0px 4px 0px;
width: 960px;
}
#topnavbar .nav {
float:right;
margin:0;
padding:0;
width:560px;
}
#topnavbar .search {
float:left;
margin:0;
padding:0;
width:228px;
text-align:right;
}
#topnavbar .date p {
color:#555;
font-size:1.0em;
line-height:45px;
}
#header {
display: block;
height: 100%;
margin: 0;
padding: 10px 0 0 0;
text-align:right;
width: 996px;
}
#header h1 {
color: #333;
font-size:2.8em;
font-weight: bold;
margin: 0 50px 20px 0;
}
#header h2 {
color: #444;
font-size:1.7em;
font-weight:normal;
margin: 0 50px 0 0;
}
#orientationbar {
height: 0px;
margin: 0;
padding: 0px 0px 0px 0px;
width:960px;
}
#orientationbar .breadcrumbs {
padding-left: 20px;
}
#orientationbar .breadcrumbs p {
color:#222;
font-size:1.0em;
font-weight:bold;
letter-spacing:1px;
line-height: 12px;
padding:00px;
float:right;
}
#orientationbar .breadcrumbs p a {
color:#333;
text-decoration:underline;
text-transform:uppercase;
text-shadow: 2px 2px 3px #888;
font-weight:bold;
padding:20px;
margin-left:10px;
}
#orientationbar .breadcrumbs p a:hover {
color:#000;
text-decoration:underline;
}
#content {
background:#fff url(../images/content_bg.gif) top left repeat-y;
border-left:#efefef 2px solid;
border-right:#efefef 2px solid;
margin:0;
padding:0;
width: 996px;
}
#content #maincontent {
float:left;
margin:0;
padding:30px 20px 30px 25px;
width:730px;
}
#content #maincontent table { /* reset */
margin:0;
padding:0;
border-spacing: 0px;
}
#content #maincontent .componentheading {
font-size:2em;
font-weight:bold;
margin:0 0 30px 0;
}
#content #maincontent .blog_more {
background:#f6f6f6;
border:#ccc 1px dashed;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
display:none;
padding:15px 15px 7px 15px;
margin:25px 0 0 0;
}
#content #maincontent .contentheading {
font-size:1.5em;
line-height:1.2em;
padding:0 0 0 0;
}
#content #maincontent .contentpaneopen {
margin:0 0 15px 0;
padding:0;
border-spacing: 0px;
}
#content #maincontent .column_separator {
display:inline-block;
border-left: 1px dashed #e0e0e0;
padding-left: 20px;
margin-left: 20px;
width:322px;
}
#content #maincontent .createdate {
color:#777;
font-size:0.9em;
font-style:italic;
}
#content #maincontent .modifydate {
display:block;
color:#999;
font-size:0.9em;
font-style:italic;
margin:8px 0 0 0;
}
#content #maincontent span.small {
color:#777;
font-size:0.9em;
font-style:italic;
}
#content #maincontent p {
color:#555;
font-size:1.1em;
line-height:1.6em;
margin:13px 0 0 0;
}
#content #maincontent a {
color:#ce4943;
text-decoration:underline;
}
#content #maincontent a:hover {
color:#b23e39;
text-decoration:underline;
}
#content #maincontent a.readon {
background:#e8f6ff url(../images/readon-arrow.gif) right no-repeat;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
color:#238ad3;
display:block;
margin:10px 0 0 0;
padding:7px 10px 5px 10px;
text-decoration:none;
}
#content #maincontent a.readon:hover {
background:#c1e5ff url(../images/readon-arrow.gif) right no-repeat;
color:#004677;
text-decoration:none;
}
#content #maincontent span.pagination {
background:#fff;
color:#888;
display:block;
margin: 25px 0 0 0;
}
#content #maincontent span.pagination strong {
color:#222;
}
#content #maincontent span.pagination span, #content #maincontent span.pagination a {
margin: 0 5px;
}
#content #sidebarcontent {
float:left;
margin:0;
padding:24px 0 10px 0;
width:220px;
}
#content #sidebarcontent h3 {
background:url(../images/sidebar-arrow.gif) left no-repeat;
color:#2b4359;
font-size:14px;
line-height:32px;
margin:0 0 3px 10px;
padding: 0 0 0 11px;
}
#content #sidebarcontent form#form-login {
border:0;
}
#content #sidebarcontent form#form-login fieldset {
border:0;
padding:0 0 20px 33px;
}
#content #sidebarcontent form#form-login fieldset label {
color:#666;
font-size:0.90em;
}
#content #sidebarcontent form#form-login input {
border:#ccc 1px solid;
padding:6px 8px;
}
#footer-menu {
background: #dcf0ff url(../images/wrapperend_bg.jpg) top no-repeat;
height: 290px;
margin: 0 0 0 0;
padding: px 0px 0 0px;
width:1000px;
}
#footer {
color:#777;
font-size:1.1em;
line-height:1.6em;
margin:0;
padding:90px 0px 0px 120px;
width:960px;
height: 0px;
}
#footer a {
color:#777;
text-decoration:underline;
}
#footer a:hover {
color:#000;
text-decoration:underline;
}
#footer .left {
float:left;
width:480px;
margin:0;
}
#footer .right {
float:left;
width:480px;
margin-left:300px;
padding:0;
text-align:left;
}
/*****************************/
/*** Listen ***/
/*****************************/
ul#navbarlist, ul#footermenulist, {
margin: 0;
padding: 0;
list-style-type: none;
height: 60px;
}
ul#footermenulist2, ul#footermenulist2 ul, ul#footermenulist2 ul li, ul#footermenulist2 ul li a, ul#footermenulist2 ul li a:hover {
height: 100px;
width:400px;
padding-left: 300px;
}
ul#brand2, ul#brand2 ul, ul#brand2 ul li, ul#brand2 ul li a, ul#brand2 ul li a:hover {
height: 80px;
width:200px;
padding-left: 150px;
float:left;
}
ul#navbarlist ul, ul#footermenulist ul{
margin: 0;
padding: 0;
list-style-type: none;
height: 50px;
}
ul#navbarlist li {
float: left;
font-size: 1.5em;
line-height: 45px;
margin: 0 5px 0 2px;
padding:12px 18px 8px 5px;
list-style-type: none;
background:url(../images/menu1_02.png) no-repeat top right;
height: 41px;
}
ul#footermenulist ul li {
float: right;
font-size: 1.2em;
line-height: 45px;
margin: 0 25px 0 0;
padding: 70px 0px;
list-style-type: none;
}
ul#navbarlist li a, ul#footermenulist ul li a{
color: #ff9900;
font-weight: bold;
text-decoration: none;
text-shadow: #ccc 1px 1px 1px;
background:url(../images/menu1_01.png) no-repeat top left;
padding:25px 24px 24px 41px;
}
ul#navbarlist li a:hover, ul#footermenulist ul li a:hover {
color: #333;
}
ul#brand {
padding-right:45px;
margin-right:45px;
}
ul#brand li {
padding:45px;
margin:45px;
}
ul#brand ul, ul#brand ul li, ul#brand ul li a, ul#brand ul li a:hover{
padding:45px;
margin:45px;
}
#content #sidebarcontent ul {
list-style-type:round;
margin:0 0 20px 20px;
padding:0;
}
#content #sidebarcontent ul li {
color:#ccc;
line-height:1.6em;
margin:0;
padding:5px;
background-image: url(../images/sfondo.png);
}
#content #sidebarcontent; ul li a {
color:#fff;
font-weight:bold;
text-decoration:none;
padding: 8px;
margin:8px;
}
#content #sidebarcontent ul li a:hover {
color:#888;
font-weight:bold;
text-decoration:underline;
}
#content #sidebarcontent form#form-login ul li {
color:#ccc;
}
/*****************************/
/*** Formulare, Inputs etc. ***/
/*****************************/
#topnavbar .search input {
background:#fff;
float: right;
font-style:italic;
border:#ccc 1px solid;
border-radius: 16px;
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
color:#666;
margin: 6px 0 0 0;
outline:none;
padding: 7px 11px;
width: 210px;
}
#brand .button #body {
padding-right: 20px;
padding-left: 8px;
}
#brand #body #menualto {
padding-right: 0px;
float: right;
padding-left: 20px;
margin-left: 20px;
width: 300px;
}
Grazie a tutti queli che mi risponderanno!