Hallo CSS Gemeinde
ich denke ich sehe den Baum vor lauter Wälder nicht.
Ich habe da ein Problem, was eigentlich nicht sein dürfte - Aber nun mal ist.
So ich Poste hier mal nur die betreffenden HTML und CSS Tags.
Was passiert da!
Also bei überwegfahren der Navigation, öffnet sich ein großer Div Container. In diesem Container will ich nun div 3spaltig neben einander positionieren. Doch momentan legt der alle 3 Divs oben Links in der Ecke übereinander.
Ich sehe den Baum nicht mehr...
Kann mir da einer Helfen..
Danke vorab
Fredolin
ich denke ich sehe den Baum vor lauter Wälder nicht.
Ich habe da ein Problem, was eigentlich nicht sein dürfte - Aber nun mal ist.
So ich Poste hier mal nur die betreffenden HTML und CSS Tags.
CSS:
#navi_hori_3 {
margin: 0;
padding: 0;
z-index: 10;
}
#navi_hori_3 ul a {
position: relative;
}
#navi_hori_3 ul li {
display: inline;
width: 130px;
float: left;
height: 20px;
margin: 5px 2px 0 0;
padding: 4px 3px;
border-top: 1px solid #575757;
border-left: 1px solid #575757;
border-right: 1px solid #575757;
border-bottom: 1px solid #575757;
background-color: #ABABAB;
}
#navi_hori_3 ul li div {
display: none;
}
#navi_hori_3 ul li:hover div {
display: block;
position: absolute;
margin-top: 6px;
}
.box_subnavi {
position: relative;
margin-left: -25%;
background-image: url(../../img/bg_subnavi.png);
background-repeat: no-repeat;
width: 616px;
height: 256px;
}
#subBox {
margin: 5px 5px;
padding: 5px 5px;
width: 100%;
float: left;
border: 1px solid #aac;
}
#navi_hori_3 .subBox_left {
margin: 0;
padding: 5px 5px;
width: 150px;
float: left;
}
#navi_hori_3 .subBox_middle {
margin: 0;
padding: 5px 5px;
width: 150px;
float: left;
border-left: 1px dashed #D6D6D6;
border-right: 1px dashed #D6D6D6;
}
#navi_hori_3 .subBox_right {
margin: 0;
padding: 5px 5px;
width: 150px;
float: left;
}
HTML:
<div id="navi_hori_3">
<h1>Navigation</h1>
<ul>
<li><a href="?act=home">Startseite</a></li>
<li><a href="?act=page1">Page1</a>
<div class="box_subnavi">
<div class="subBox_left">
<ul>
<li><a href="?act=page2?sub=submenu1">Submenu1</a></li>
<li><a href="?act=page2?sub=submenu2">Submenu2</a></li>
<li><a href="?act=page2?sub=submenu3">Submenu3</a></li>
<li><a href="?act=page2?sub=submenu4">Submenu4</a></li>
<li><a href="?act=page2?sub=submenu5">Submenu5</a></li>
<li><a href="?act=page2?sub=submenu6">Submenu6</a></li>
</ul>
</div>
<div class="subBox_middle">
DU
<!--
<ul>
<li><a href="?act=page3?sub=submenu1">Submenu1</a></li>
<li><a href="?act=page3?sub=submenu2">Submenu2</a></li>
<li><a href="?act=page3?sub=submenu3">Submenu3</a></li>
<li><a href="?act=page3?sub=submenu4">Submenu4</a></li>
<li><a href="?act=page3?sub=submenu5">Submenu5</a></li>
<li><a href="?act=page3?sub=submenu6">Submenu6</a></li>
</ul>
//-->
</div>
<div class="subBox_right">
DA
<!--
<ul>
<li><a href="?act=page4?sub=submenu1">Submenu1</a></li>
<li><a href="?act=page4?sub=submenu2">Submenu2</a></li>
<li><a href="?act=page4?sub=submenu3">Submenu3</a></li>
<li><a href="?act=page4?sub=submenu4">Submenu4</a></li>
<li><a href="?act=page4?sub=submenu5">Submenu5</a></li>
<li><a href="?act=page4?sub=submenu6">Submenu6</a></li>
</ul>
//-->
</div>
</div>
</li>
<li><a href="?act=page2">Page2</a>
<div class="box_subnavi">
<div class="subBox_left">
Hallo
<!--
<ul>
<li><a href="?act=page2?sub=submenu1">Submenu1</a></li>
<li><a href="?act=page2?sub=submenu2">Submenu2</a></li>
<li><a href="?act=page2?sub=submenu3">Submenu3</a></li>
<li><a href="?act=page2?sub=submenu4">Submenu4</a></li>
<li><a href="?act=page2?sub=submenu5">Submenu5</a></li>
<li><a href="?act=page2?sub=submenu6">Submenu6</a></li>
</ul>
//-->
</div>
<div class="subBox_middle">
DU
<!--
<ul>
<li><a href="?act=page3?sub=submenu1">Submenu1</a></li>
<li><a href="?act=page3?sub=submenu2">Submenu2</a></li>
<li><a href="?act=page3?sub=submenu3">Submenu3</a></li>
<li><a href="?act=page3?sub=submenu4">Submenu4</a></li>
<li><a href="?act=page3?sub=submenu5">Submenu5</a></li>
<li><a href="?act=page3?sub=submenu6">Submenu6</a></li>
</ul>
//-->
</div>
<div class="subBox_right">
DA
<!--
<ul>
<li><a href="?act=page4?sub=submenu1">Submenu1</a></li>
<li><a href="?act=page4?sub=submenu2">Submenu2</a></li>
<li><a href="?act=page4?sub=submenu3">Submenu3</a></li>
<li><a href="?act=page4?sub=submenu4">Submenu4</a></li>
<li><a href="?act=page4?sub=submenu5">Submenu5</a></li>
<li><a href="?act=page4?sub=submenu6">Submenu6</a></li>
</ul>
//-->
</div>
</div>
</li>
<li><a href="?act=page3">Page3</a>
<div class="box_subnavi">
</div
</li>
<li><a href="?act=page4">Page4</a>
<div class="box_subnavi">
</div
</li>
<li><a href="?act=login">Login</a>
<div class="box_subnavi">
</div
</li>
</ul>
</div>
Was passiert da!
Also bei überwegfahren der Navigation, öffnet sich ein großer Div Container. In diesem Container will ich nun div 3spaltig neben einander positionieren. Doch momentan legt der alle 3 Divs oben Links in der Ecke übereinander.
Ich sehe den Baum nicht mehr...
Kann mir da einer Helfen..
Danke vorab
Fredolin