der Titel ist nicht so dolle, aber ich wußte nicht, wie ich es hätte besser beschreiben können (vor allem mit wenig Worten). Für eine Freundin habe ich vor kurzem eine Seite gebaut. Das Template ist selbst programmiert und hat local (nur HTML & CSS) auch super funktioniert. Nun läuft die Seite seit einigen Tagen in CMSms und im Firefox 2 bzw. 3 ist auch alles ok.
ABER:
Alle relevanten IEs (6, 7 &
zicken rum. Alle drei zeigen das Layout nicht zentriert, sondern linksbündig. Aber das merkwürdigste ist, dass im IE7 und IE8 das Dropdown-Menü unter "Unser Angebot" nicht funktioniert. Im 6er wird dafür ein kleines Script geladen, da geht es dann wieder.Hier gehts erstmal zur Seite: www.kosmetik-carpe-diem.de
Ich behaupte mal, dass ich mittlerweile recht fit bin was HTML/CSS angeht. Ich habe gestern nun die Seite einmal unter XAMPP installiert, da ich erst die Vermutung hatte, es hat etwas mit dem Provider zu tun. Hat es anscheinend nicht, denn auch lokal tritt dieser Fehler auf.
Wahrscheinlich bin ich mittlerweile betriebsblind und sehe den Wald vor lauter Bäumen nicht - deshalb mein Hilferuf hier im Forum. Sieht jemand einen Fehler?
Hier mal das Template:
Code: Select all
{process_pagedata}
<!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">
<head>
<title>{title} | {sitename}</title>
{metadata}
{stylesheet}
<!--[if lt IE 7]>
<__script__ type="text/javascript" src="js/jquery/jquery.js"></__script>
<__script__ type="text/javascript" src="js/jquery/jquery.dropdown.js"></__script>
<![endif]-->
</head>
</__body>
<div class="container">
<div class="header">
<div class="logo">
<h1>Carpe Diem - genieße den Moment</h1>
</div>
<div class="navi">
{menu template='main_menu' excludeprefix='kontakt,impressum'}
</div>
</div>
<div class="content">
<div class="content_left">
<h2>Kosmetik & Wellness<br /><span>Sylvia Deutsch</span></h2>
<div class="image_center">
{content block='Bild'}
</div>
</div>
<div class="content_right">
<h3>{title}</h3>
{content}
</div>
</div>
<div class="footer">
{global_content name='footer'}
</div>
</div>
<__body>
</__html>Code: Select all
* {
margin: 0;
padding: 0;
}
body {
background: #fef5e7;
font-family: arial, sans-serif;
font-size: 12px;
color: #43373b;
}
img {
border: 0;
}
p {
margin-bottom: 1em;
}
h4 {
font-size: 14px;
font-weight: normal;
font-variant: small-caps;
margin-bottom: 1em;
}
a {
color: #43373b;
}
a:hover {
text-decoration: none;
}
input,
textarea {
background: none;
font-family: arial, sans-serif;
font-size: 12px;
}
input.button {
background: #fff;
}
tr.odd {
background: #fef5e7;
}
tr.even {
background: #fff;
}
td {
padding: 4px 2px;
}
td h4 {
margin-bottom: 0;
}
td p {
margin-bottom: 0;
text-align: left;
}
.container {
margin: auto;
width: 978px;
}
.header {
width: 978px;
height: 156px;
background: url(uploads/images/header.jpg) no-repeat;
}
.logo {
float: left;
width: 420px;
height: 40px;
margin-left: 48px;
margin-top: 80px;
display: inline;
background: url(uploads/images/logo.gif) no-repeat;
}
.logo h1 {
display: none;
}
.navi {
float: right;
width: 435px;
margin-right: 60px;
margin-top: 95px;
display: inline;
font-size: 16px;
}
.navi ul li.separator {
padding-top: 10px;
}
.content {
width: 978px;
height: 380px;
background: url(uploads/images/content.jpg) no-repeat;
}
.content_left,
.content_right {
width: 430px;
height: 380px;
display: inline;
}
.content_left {
float: left;
margin-left: 48px;
}
.image_center {
text-align: center;
margin-top: 5px;
}
.content_left h2 {
font-size: 18px;
letter-spacing: 4px;
font-weight: normal;
text-align: center;
line-height: 1.2em;
}
.content_left h2 span {
font-size: 14px;
}
.content_right {
height: 370px;
float: right;
margin-right: 60px;
overflow: auto;
margin-bottom: 10px;
}
.content_right p {
padding-right: 10px;
text-align: justify;
}
.content_right h3 {
font-size: 18px;
font-weight: normal;
margin-bottom: 0.4em;
}
.content_right ul {
padding-right: 10px;
}
.content_right ul li {
margin-bottom: 1em;
margin-left: 2em;
}
.footer {
clear: both;
width: 978px;
height: 94px;
background: url(uploads/images/footer.jpg) no-repeat;
}
.footer p {
margin-left: 54px;
padding-top: 15px;
}Code: Select all
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
list-style: none;
margin: 0;
padding: 0;
}
ul.dropdown {
position: relative;
z-index: 597;
float: left;
}
ul.dropdown li {
float: left;
line-height: 1.3em;
vertical-align: middle;
zoom: 1;
}
ul.dropdown li a {
text-decoration: none;
color: #43373b;
padding: 10px 10px 2px 10px;
display: block;
}
ul.dropdown li a:hover,
ul.dropdown li a.current {
background: #fef5e7;
}
ul.dropdown li.hover,
ul.dropdown li:hover {
position: relative;
z-index: 599;
cursor: default;
}
ul.dropdown ul {
visibility: hidden;
position: absolute;
top: 100%;
left: -2px;
z-index: 598;
width: 150px;
background: #fff;
border-left: 1px solid #43373b;
border-right: 1px solid #43373b;
border-top: 1px dotted #43373b;
}
ul.dropdown ul li {
float: none;
border-bottom: 1px dotted #43373b;
}
ul.dropdown ul li a {
padding: 2px 2px 2px 10px;
font-size: 14px;
}
ul.dropdown ul ul {
top: -1px;
left: 100%;
}
ul.dropdown li:hover > ul {
visibility: visible;
}
ul.dropdown li.rtl ul {
top: 100%;
right: 0;
left: auto;
}
ul.dropdown li.rtl ul ul {
top: 1px;
right: 99%;
left: auto;
}Bin echt etwas ratlos und über jeden Tip dankbar...
Viele Grüße
Jan
Die Seite läuft mit CMSms 1.5.4
