Rahmen um einzelne Bereich bei UL LI

[Matthias]

Ich habe eine Aufzählung in Listen verpackt, nun versuche ich Kramphaft um die einzelnen Punkte:

--------------
!Thema1      !
!sub1        !
!sub2        !
--------------
!Thema2      !
!sub1        !
!sub2        !
--------------

einen Rahmen zu bekommen, aber ich schaffe es einfach nicht.
Die Idee wäre das jedes Umrandung (Box) gleich hoch ist, wenn das nicht geht, dann halt mit einem fixen Wert. Jedenfalls soll es dann möglich sein, das sich alles so aufruft das es neben, bzw. Untereinder ist!

Bis jetzt bin ich soweit:

<style type="text/css">  
  
.listen{font-family: arial, sans-serif; width:600px;  position:relative; font-size:12px; z-index:100;}  
.listen ul {padding:0; margin:0; list-style: none;font-weight: bold;}  
.listen ul li {float:left;width:200px; }  
.listen ul li a, .listen ul li a:visited {display:block; text-decoration:none; color:#000;text-align:left; font-size:12px; overflow:hidden;}  
.listen ul li ul {width:200px;font-weight: normal;}  
	  
</style>

<div class="listen">  
	<ul>  
		<li>Thema1  
		<ul>  
			<li>sub1</li>  
			<li>sub2</li>  
		</ul>  
		</li>  
		<li>Thema2  
			<ul>  
				<li>sub1</li>  
				<li>sub2</li>  
				<li>sub3</li>  
				<li>sub4</li>  
		</ul>  
		</li>  
			<li>Thema3  
			<ul>  
				<li>sub1</li>  
				<li>sub2</li>  
		</ul>  
		</li>  
			<li>Thema4  
		<ul>  
			<li>sub1</li>  
			<li>sub2</li>  
		</ul>  
		</li>  
		<li>Thema5  
			<ul>  
				<li>sub1</li>  
				<li>sub2</li>  
				<li>sub3</li>  
				<li>sub4</li>  
		</ul>  
		</li>  
			<li>Thema6  
			<ul>  
				<li>sub1</li>  
				<li>sub2</li>  
		</ul>  
		</li>  
	</ul>  
</div>

[Matthias Apsel]

Om nah hoo pez nyeetz, Matthias!

Bei deiner Konstruktion sind es die jeweils ersten Listenpunkte die einen Rahmen bekommen sollen, der Kombinator ">" sollte weiter helfen.

Matthias

[Matthias]

ich verstehe aber nicht wie ich es bei meiner Liste anwenden kann?

Om nah hoo pez nyeetz, Matthias!

Bei deiner Konstruktion sind es die jeweils ersten Listenpunkte die einen Rahmen bekommen sollen, der Kombinator ">" sollte weiter helfen.

Matthias

[Matthias Apsel]

Om nah hoo pez nyeetz, Matthias!

ich verstehe aber nicht wie ich es bei meiner Liste anwenden kann?

Du möchtest die Eigenschaft Rahmen nur auf bestimmte Listenelemente anwenden. Ich bin sicher, ">" hilft. Hast du das Verlinkte gelesen? Was hast du probiert, was hat nicht funktioniert. Mach dir auch den Unterschied klar zwischen

.listen > ul > li

und

.listen ul li

Matthias

[Matthias]

OOOOOOOOOOOOO

.listen > ul > li {border:1px solid #6EB327; height:300px;}
.listen ul li {float:left;width:200px;}

Jetzt habe ich die Box mit 300 Pixel angegeben, kann ich das auch irgendwie flexibler lösen?

Ich meine das so, die boxen werden per float:left nebeneinander gelistet. Wenn sie jetzt alle 300 Pixel hoch sind klappt das auch wenn der Inhalt unterschiedlich ist. Wenn ich die Höhe wegnehme,  dann akkn es sein, das ich die Boxen verschieden, je nach Inhalt. Wie schaffe ich es ohne height:300px; das sie immer streng nebeneinander und dann in der nächsten Zeile sind, also nich das sich zwei in ein anderschieben?

Matthias

[ChrisB]

Hi,

Ich habe eine Aufzählung in Listen verpackt, nun versuche ich Kramphaft um die einzelnen Punkte:

---

!Thema1      !
!sub1        !
!sub2        !

!Thema2      !
!sub1        !
!sub2        !

einen Rahmen zu bekommen, aber ich schaffe es einfach nicht.

Also willst du die LI auf oberster Ebene mit einem Rahmen versehen. Wie du diese selektieren kannst, hat Matthias dir schon gesagt.

Damit diese Boxen auch eine Höhe entsprechend ihrer gefloateten inhalte bekommen, musst du die float-Bereiche einschließen - siehe http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout#float-einschliessen
Den ganzen Artikel solltest du ruhig mal durcharbeiten, denn das ist grundlegendes Wissen.

Die Idee wäre das jedes Umrandung (Box) gleich hoch ist, wenn das nicht geht, dann halt mit einem fixen Wert.

Eine Mindesthöhe vorzugeben, steht dir natürlich frei.

MfG ChrisB