Forum PHP.pl

Witam! Mam taki kod menu:

[HTML] pobierz, plaintext 
#left_menu { 
    float: left; 
    width: 240px; 
    margin:  15px 0 15px 5px; 
    padding: 5px; 
    background-color: #FFF; 
    border-radius: 3px; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px; 
    -khtml-border-radius: 3px; 
    list-style: none; 
    display: block; 
} 
 
#left_menu li a { 
    display: block; 
    height: 20px; 
    margin: 4px 0 5px; 
    font-family: tahoma; 
    font-size: 11px; 
    font-weight: bold; 
    color: #000; 
    text-decoration: none; 
    padding: 5px; 
    line-height : 20px; 
} 
 
#left_menu li a:hover { 
    background: #0b4774;
	color: #FFF;  	
	margin: 0 auto;
	padding: 5px; 
    margin: 4px 0 5px; 
}
[HTML] pobierz, plaintext 

HTML:

[HTML] pobierz, plaintext 
<ul id="left_menu">
	<li><a class="menu" href="index.php">Strona główna</a></li>';
	<li><a class="menu" href="#">Menu #2</a></li>
        <li><a class="menu" href="#">Menu #3</a></li>
</ul>
 
<ul id="left_menu">
	<li><a class="menu" href="index.php">Strona główna </a></li>';
	<li><a class="menu" href="#">Menu #2 2 </a></li>
        <li><a class="menu" href="#">Menu #3 2 </a></li>
</ul>
[HTML] pobierz, plaintext 

Problem w tym, że mam te dwa bloki, ale są one obok siebie. Co zrobić, by były jeden pod drugim?
Dodanie display:block; do #left_menu nie działa.

To sie naprawiło, ale kolejna rzecz sie zepsuła.

Po lewej mam te menu, a po prawej mam tak jakby główne okno z informacjami i jest ono generowane coś jak system newsow.


CSS:

[HTML] pobierz, plaintext 
.right_side { 
    width: 600px; 
    background: #fefefe; 
    color:#2085d3; 
    text-align:left;
	margin: 15px 5px 5px 15px;
    float:right; 
    border-radius: 3px; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px; 
    -khtml-border-radius: 3px; 
	padding: 5px; 
	display:block;
} 
 
.right_title
{
    width: 600px; 
    height: 25px; 
    color: #000; 
    text-align: center; 
    padding-top: 10px; 
	font-weight: bold; 
    background : url('../images/cellpic.gif'); 
}
 
.right_content {
    margin-top: 8px;
    margin-left: auto; 
    margin-right: auto; 
    text-align: left	; 
    height: auto; 
    max-width: 625px;
    color: #000;
}
 
.right_author {
    width: auto; 
    height: 15px; 
    color: #a1a1a1; 
    padding-top: 5px; 
    background-color: #f1f1f1; 
    float: right; 
    padding-left: 6px; 
    padding-right: 6px; 
    margin-top: 15px; 
    font-size: 10px;
}
[HTML] pobierz, plaintext 

HTML:

[HTML] pobierz, plaintext 
<div class="right_side">	  
	<div class="right_title">Tytuł</div>
	<div class="right_content">Tresc</div>
	<div class="right_author">Autor</div>
</div>
<div class="right_side">	  
	<div class="right_title">Tytuł#2</div>
	<div class="right_content">Tresc#2</div>
	<div class="right_author">Autor#2</div>
</div>
[HTML] pobierz, plaintext 

I teraz ta cała treść spadła w dół i nie jest na równi z menu które jest po lewej, tylko jest menu, po prawe pusto i jak się kończy menu to dopiero pokazuje się główna treść.

To zamiast clear:both ,daj clear:left;

Ten post edytował Niktoś 14.05.2012, 00:13:58

Niestety, nic nie pomogło.

Dobra to powinno pomóc:

ul{
display:block;
clear:left;

}

Ten post edytował Niktoś 14.05.2012, 00:29:08

To wróciło do wersji początkowej - menu obok siebie.


Link: http://goldenx2.unixstorm.org/


ul{
display:block;
clear:left;

}

niestety, nie działa.

Ten post edytował GoldeNx3 14.05.2012, 00:35:54

To też nie działa jak powinno, ale zrobiłem już po swojemu. Wszystkie menu dałem na jeden UL i oddziela je tylko tytuł, wydaje mi się, iż wygląda równie dobrze, a nawet lepiej.

Co do zagnieżdżania to już jutro poprawię (span mogę dać między UL?), dzięki wielkie!

Ten post edytował GoldeNx3 14.05.2012, 01:29:31

Jakbyś mógł, to pomóż też z tym nagłówkiem, aby nie było tego div'a. ;/

Aktualnie mam tak:

[HTML] pobierz, plaintext 
<ul id="left_menu">
		<div class="main_left_nav">
			<div class="main_left_nav_title">Menu</div>
		</div>
		<li><a class="menu" href="index.php">Strona główna</a></li>
</ul>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
.main_left_nav  { 
	background : url('../images/cellpic.gif'); 
	height : 30px; 
	width : 100%; 
	margin-bottom: 5px;
	display:block;
	text-align : center; 
 } 
.main_left_nav_title  { 
	color : #000000; 
	font-weight : bold; 
	text-align : center; 
	line-height : 30px; 
	vertical-align : middle; 
 } 
[HTML] pobierz, plaintext 

Ten post edytował GoldeNx3 14.05.2012, 01:47:23

Spróbuj tak:

[HTML] pobierz, plaintext 
<div class="main_left_nav">
<div class="main_left_nav_title">Menu</div>
<ul id="left_menu">
<li><a class="menu" href="index.php">Strona główna</a></li>
</ul>
</div>
[HTML] pobierz, plaintext