Hallo zusammen,
ich bin nicht nur hier neu, sondern beschäftige mich auch erst seit kurzem mit dem Aufbau von Webseiten. Also erstelle ich derzeit ein Testprojekt. Dazu habe ich Typo3 installiert und habe nun begonnen mich in html, css und typoscript ein wenig einzuarbeiten.
Nun stehe ich aber vor einem Problem das ich nicht mittels Google Suche u.ä. lösen kann.
Der Firefox stellt bei meinem Test nicht den Rahmen um mein div dar. Dies macht der Internetexplorer. Dafür sind hier die Abstände bei dem Menü und dem oberen Bild nicht richtig. Egal wie ich versuche das hinzuschieben ( margin, pading, position, etc), will der eine, oder der andere nicht. Ich habe gelesen, das der IE hier einiges anders interpretiert, aber nur bis Version 6? Ich teste mit IE8. Also könnte ich eine Browserweiche einbauen. Ist das sinnvoll und notwendig?
Hier meine template:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Elektro Hergarten</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="language" content="de" />
<link rel="stylesheet" type="text/css" href="fileadmin/style.css" />
</head>
<body>
<!-- ###DOKUMENT### begin -->
<div id="container">
<div id="menu_oben">
###MENU_OBEN###
</div>
<div id="menu_mitte">
###MENU_MITTE###
</div>
<div id="feld_mitte">
###MITTE_CONTENT###
</div>
<div id="textcontainer">
<div id="unten_links">
###UNTEN_LINKS###
</div>
<div id="unten_mitte">
###UNTEN_MITTE###
</div>
<div id="unten_rechts">
###UNTEN_RECHTS###
</div>
</div>
</div>
<div id="footer">
Footer
</div>
<!-- ###DOKUMENT### end -->
</body>
Hier der Anfang meiner css:
/*----------------------------------- Grundtemplate -----------------------------------*/
body{
text-align:center;
background-image: url(../fileadmin/images/background.gif);
width: auto;
background-repeat: repeat-x;
background-color: #FFF;
background-position: center 16px;
font-family: Arial, Helvetica, sans-serif;
font-size: 100,01%
}
div#container{
width:980px;
border-width: 1px;
border-style: solid;
border-color: #CCC;
background-image: url(../fileadmin/images/background_logo2.png);
background-repeat: no-repeat;
margin: auto;
position:relative; top: 9px;
}
div#menu_oben {
text-align:right;
color:#000;
font-size: 14px;
font-style: normal;
margin-bottom: 95px;
margin-right: 10px;
margin-top: 5px
}
div#menu_mitte{
text-align: left;
font-size: 14px;
font-style: normal;
color: #000;
position: absolute; top: 90px; left: 120;
}
div#feld_mitte{
width: 980px;
font-size: 14px;
height: 300px;
margin-top: -9px;
margin-bottom: 5px;
}
div#textcontainer{
width: 980px;
border-style: solid;
border-color: #000;
background-image: url(../fileadmin/images/textcontainerbackground.png);
background-repeat: repeat-y;
margin-top: -6px;
border: 1px;
/* [disabled]position: absolute; */
top: 405px;
}
div#unten_links{
float:left;
width: 310px;
font-size: 14px;
text-align: left;
margin-left: 8px;
margin-right: 17px;
}
div#unten_mitte{
float:left;
width: 310px;
font-size: 14px;
text-align: left;
margin-right: 19px;
}
div#unten_rechts{
float:right;
width: 310px;
font-size: 14px;
text-align: left;
}
div#footer{
margin-top: 5px;
font-size: 14px;
}
Wäre klasse, wenn mir hier jemand helfen kann.
Gruß, Holger
Hier kann man sich das ganze ansehen: hergarten.hartwig-at.de
ich bin nicht nur hier neu, sondern beschäftige mich auch erst seit kurzem mit dem Aufbau von Webseiten. Also erstelle ich derzeit ein Testprojekt. Dazu habe ich Typo3 installiert und habe nun begonnen mich in html, css und typoscript ein wenig einzuarbeiten.
Nun stehe ich aber vor einem Problem das ich nicht mittels Google Suche u.ä. lösen kann.
Der Firefox stellt bei meinem Test nicht den Rahmen um mein div dar. Dies macht der Internetexplorer. Dafür sind hier die Abstände bei dem Menü und dem oberen Bild nicht richtig. Egal wie ich versuche das hinzuschieben ( margin, pading, position, etc), will der eine, oder der andere nicht. Ich habe gelesen, das der IE hier einiges anders interpretiert, aber nur bis Version 6? Ich teste mit IE8. Also könnte ich eine Browserweiche einbauen. Ist das sinnvoll und notwendig?
Hier meine template:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Elektro Hergarten</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="language" content="de" />
<link rel="stylesheet" type="text/css" href="fileadmin/style.css" />
</head>
<body>
<!-- ###DOKUMENT### begin -->
<div id="container">
<div id="menu_oben">
###MENU_OBEN###
</div>
<div id="menu_mitte">
###MENU_MITTE###
</div>
<div id="feld_mitte">
###MITTE_CONTENT###
</div>
<div id="textcontainer">
<div id="unten_links">
###UNTEN_LINKS###
</div>
<div id="unten_mitte">
###UNTEN_MITTE###
</div>
<div id="unten_rechts">
###UNTEN_RECHTS###
</div>
</div>
</div>
<div id="footer">
Footer
</div>
<!-- ###DOKUMENT### end -->
</body>
Hier der Anfang meiner css:
/*----------------------------------- Grundtemplate -----------------------------------*/
body{
text-align:center;
background-image: url(../fileadmin/images/background.gif);
width: auto;
background-repeat: repeat-x;
background-color: #FFF;
background-position: center 16px;
font-family: Arial, Helvetica, sans-serif;
font-size: 100,01%
}
div#container{
width:980px;
border-width: 1px;
border-style: solid;
border-color: #CCC;
background-image: url(../fileadmin/images/background_logo2.png);
background-repeat: no-repeat;
margin: auto;
position:relative; top: 9px;
}
div#menu_oben {
text-align:right;
color:#000;
font-size: 14px;
font-style: normal;
margin-bottom: 95px;
margin-right: 10px;
margin-top: 5px
}
div#menu_mitte{
text-align: left;
font-size: 14px;
font-style: normal;
color: #000;
position: absolute; top: 90px; left: 120;
}
div#feld_mitte{
width: 980px;
font-size: 14px;
height: 300px;
margin-top: -9px;
margin-bottom: 5px;
}
div#textcontainer{
width: 980px;
border-style: solid;
border-color: #000;
background-image: url(../fileadmin/images/textcontainerbackground.png);
background-repeat: repeat-y;
margin-top: -6px;
border: 1px;
/* [disabled]position: absolute; */
top: 405px;
}
div#unten_links{
float:left;
width: 310px;
font-size: 14px;
text-align: left;
margin-left: 8px;
margin-right: 17px;
}
div#unten_mitte{
float:left;
width: 310px;
font-size: 14px;
text-align: left;
margin-right: 19px;
}
div#unten_rechts{
float:right;
width: 310px;
font-size: 14px;
text-align: left;
}
div#footer{
margin-top: 5px;
font-size: 14px;
}
Wäre klasse, wenn mir hier jemand helfen kann.
Gruß, Holger
Hier kann man sich das ganze ansehen: hergarten.hartwig-at.de
