Vielen Dank für die schnelle Antwort. Habe die Anweisungen geändert, aber vermutlich nicht richtig (plaziert). Habes es mehrfach versucht, komme aber nicht weiter. Die Sub-Navigation erscheint jetzt im IE am linken Bildrand. Wäre super, wenn Ihr Euch das nochmals anschauen könnt. Habe die Korrekturen im nachfolgenden Code in rot/fett markiet. Wäre super + nochmals vielen Dank.
Code:
* {
margin: 0;
padding: 0;
}
body {
margin: 20px;
padding: 0;
background: #444444;
font: normal small Arial, Helvetica, sans-serif;
color: #6F4503;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
text-transform: uppercase;
color: #FFC971;
}
h1, h2, h3 {
}
h4, h5, h6 {
}
p, ul, ol, blockquote {
margin-top: 0;
}
a {
color: #6F4503;
text-decoration: none;
}
a:hover {
text-decoration: none;
}
img {
border: none;
}
/* Header */
#logo {
width: 780px;
height: 50px;
margin: 0 auto;
padding: 25px 0 0 0;
background: #FFEE8F url(images/bigbg.gif) repeat-x;
border: 2px solid #382910;
border-bottom: 2px solid #382910;
}
#logo h1 {
text-align: center;
font-size: 3em;
}
#givehope {
float: left;
}
#flags {
float: right;
padding: 0 10px 0 0;
}
#logo h2 {
text-align: center;
font-size: 1.4em;
}
#logo a {
text-decoration: none;
}
/* Menu */
div#navcontainer
{
width: 780px;
height: 36px;
margin: 0 auto;
padding: 0;
background: #DA8802;
border: 2px solid #382910;
border-top: 2px solid #382910;
border-bottom: 0px solid #382910;
}
ul#menu
{
margin: 0;
padding: 0;
list-style: none;
}
*+ html li:hover {
positition: relative;
}
*+ html #subMenu {
position: relative; top: 100%; left: 0px;
}ul#menu li
{
display: inline; /* kann evtl. weggelassen werden - noch prüfen */
list-style-type: none;
margin: 0;
padding: 0;
}
ul#subMenu
{
margin: 0;
padding: 0;
position: absolute;
top: 340px;
width: 120px;
display: none;
clear: left;
}
ul#menu li a:link, ul#menu li a:visited
{
text-decoration: none;
width: 120px;
text-align: center;
height: 26px;
padding-top: 10px;
background: #DA8802;
border-top: 0;
color: #FCEB8A;
float: left;
}
ul#menu li
{
float: left;
position: static; /* positioniert subnavi unter navig */
list-style: none;
margin: 0;
padding: 0;
}
ul#menu>li a:hover,
ul#menu>li a:focus,
ul#menu>li a:active,
ul#menu>li:hover,
ul#menu>li:focus,
ul#menu>li:active
{
background: #80612A;
color: #FCEB8A;
}
li:hover ul#subMenu {
display: block;
}
ul#subMenu li {
background: #DA8802;
border-bottom: 0;
border-top: 2px solid #FCEB8A;
color: #80612A;
display: block;
}
ul#subMenu li a:link,
ul#subMenu li a:visited {
width: 120px;
border-top: 2px solid #FCEB8A;
}
ul#subMenu li:hover a {
background: #80612A;
color: #FCEB8A;
}
/* Splash */
#image {
width: 780px;
margin: 0 auto;
background: #382910;
border-left: 2px solid #382910;
border-right: 2px solid #382910;
}
/* Content */
#body {
width: 780px;
margin: 0 auto;
background: #F3EE72;
border: 2px solid #382910;
}
#body .title {
padding: 10px 20px;
background: #FFEE8E url(images/smallbg.gif) repeat-x left bottom;
font-size: 1em;
}
#body .story {
padding: 20px;
border: 0px solid #8D5700;
}
#body .table {
padding: 0 5px;
font: normal small Arial, Helvetica, sans-serif;
color: #6F4503;
}
#body img {
float: right;
margin-left: 10px;
}
#body h2 {
text-align: left;
font-size: 1.3em;
color: #8D5700;
}
/* bot*/
#bot {
width: 760px;
margin: 0 auto;
padding: 10px 10px;
background: #DA8802;
border: 2px solid #382910;
border-top: none;
}
#bot p {
margin: 0;
padding: 0;
text-align: center;
font-size: x-small;
color: #000000;
}
#bot a {
color: #000000;
}