List in absoulute div?

**CharlesBukowski** · 17.07.2009 11:13

Hi zusammen,

ich baue gerade an einer XHTML Website und habe diverse p-elementen mit postition:absolute erstellt und mit Texten gefüllt.

Jetzt würde ich gerne eine Auflistung in einer dieser Boxen haben - wie bekomme ich es hin, dass in der absoluten box eine Auflistung habe, oder schließt sich absoulute mit li aus?

Das p-element sieht wie folgt aus:

Das sieht so aus:

HTML-Code:

	<p class="content" style="position:absolute; left: 509px; top: 270px; height: 160px;">liste 1<br />
	  liste 2<br />
	  liste 3</p>

so habe ich es unter anderem probiert:

HTML-Code:

	<p class="content" style="position:absolute; left: 509px; top: 270px; height: 160px;"><li>liste 1<br />
	  liste 2<br />
	  liste 3</li></p>

Ich hoffe, der Code ist nicht zu schlimm! :-)

Danke für eure Hilfe!

AD

**jayjay** · 17.07.2009 11:16

HTML-Code:

<ul>
    <li>so</li>
    <li>geht</li>
    <li>eine</li>
    <li>liste</li>
</ul>

wie sieht der rest des codes aus?

**Guin** · 17.07.2009 11:17

Moin.

ich baue gerade an einer XHTML Website

Warum XHTML?

Ich hoffe, der Code ist nicht zu schlimm! :-)

Absolute Positionierungen koennen dir speter viele Probleme bereiten.
Ansonsten "wie sieht der rest des codes aus?"

***

[edit]
jayjay war schneller mit der Antwort.
Statt ul geht natuerlich auch ol

**CharlesBukowski** · 17.07.2009 11:40

Hi -

danke für die Antworten - und sorry für meine Unwissenheit: Ich versuche mich ja immer weiter zu verbessern:

hier der Code (die CSS Eigenschaften sind in einer externen Datei:

HTML-Code:

#bodytopmainPan #bodytopPan .content {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 13px;
	width: 210px;
	letter-spacing: 0em;
	line-height: 1.35em;
	border: thick solid #FFF;
	padding: 5px;
}

so ist der Code

HTML-Code:

<div class="_image"></div>
  <p id="sitemap" style="position:absolute; left: 4px; top: -43px; height: 11px; width: 676px;"><a href="test.html">Text</a> -&gt; <a href="test_test.html">Energie</a></p>
	<h2>TextTextTextTextText</h2>
	
<p class="content" style="position:absolute; left: 259px; top: 270px; height: 160px;">H
ier steht Text</p><p>&nbsp;</p><p class="content" style="position:absolute; left: 8px; top: 270px; height: 160px;">hier steht Text</p>	
	<p class="content" style="position:absolute; left: 509px; top: 270px; height: 160px;">liste Elemente</p></div>
</div>

Wenn das zu viel Wirr Warr ist, was ich gut verstehen kann - noch eine Frage:

Kann man in ein p-element in absolute Zustand eine Liste einfügen?
sollte dieser Code dann so eingefügt werden?:

HTML-Code:

<p class="content" style="position:absolute; left: 509px; top: 270px; height: 160px;"><ul>
    <li>so</li>
    <li>geht</li>
    <li>eine</li>
    <li>liste</li>
</ul></p>

Danke für eure Hilfe!!

AD

**jayjay** · 17.07.2009 11:48

liste in absatz ist nicht valide!
lass die code-schnipsel, zeig den gesamten code (link geht auch).
was genau willst du erreichen? grafisch (skizze) geht auch...

**wildmieze** · 17.07.2009 12:04

.. du kannst die styleeigenschaften dem <ul> geben und auf das <p> verzichten .. also

Code:

<p> .. irgendwas </p>
<ul class="content" style="position:absolute; left: 509px; top: 270px; height: 160px;">
    <li>so</li>
    <li>geht</li>
    <li>eine</li>
    <li>liste</li>
</ul>
<p>
... nochmal anderer text
</p>

**CharlesBukowski** · 17.07.2009 12:05

Hi -

ja Sorry für die Schnipsel!

Hier habe ich mal ein html Code, der verdeutlicht, was ich erreichen möchte:

HTML-Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<p class="content" style="position:absolute; left: 504px; top: 46px; height: 220px; width: 203px;">Hier drin solle eine Liste stehen:<li>1</li><li>2</li><li>3</li>
</p>

</body>
</html>

Ich habe vor, auf der Seite, die noch (garnicht online ist) mehrere frei schwebende p-Elemente mit position:absolute nebeneinander zu positionieren.
In einem soll eben auch ein Auflistung vorkommen.

Danke!

Bukowski

**jayjay** · 17.07.2009 12:10

man nehme besser divs.
zur positionierung

**CharlesBukowski** · 17.07.2009 12:27

Danke Wildmieze -

so meine ich das -

allerdings sind die Punkte der Liste außerhalb des Kästchens.

Muss man <li> nun noch mit margin nach links schieben?

Danke!

Bukowski

**CharlesBukowski** · 17.07.2009 12:29

Nochmal ich:

Danke! Es klappt!

Danke - Danke!

Super.

**wildmieze** · 17.07.2009 13:07

wenn du die <li> mit margin verschoben hast, dann kontrollier das ergebnis besser nochmal in verschiedenen browsern, die schieben das gerne mal unterschiedlich^^

und jayjay hat recht - <div> ist die bessere wahl .. da hättest du auch die liste reinpacken können

.. ich hatte angenommen, daß du dich schon in einer box (=div) befindest und zwischen den textabsätzen (=p) noch ne liste haben willst ..

**CharlesBukowski** · 17.07.2009 13:12

Hi -

ja, ich bin auch in einem DIV. Ich denke, dass sollte funktionieren. Ich teste das noch mal ausgiebig in verschiedene Browsern.

Danke euch allen!

Charly

zur Startseite vom TP

Thema: List in absoulute div?

LinkBack

Themen-Optionen

Thema durchsuchen

Thema bewerten

List in absoulute div?

Ähnliche Themen

BB-code-list

excludeAlreadyDisplayedNews nur für list?!

CSS list-style-image

List Menue...

li mit list-icon

Stichworte

Aktive Benutzer

Aktive Benutzer