Html Boxen abtrennen ???

mamboobamboo

Hi
ich habe 2 html boxen hintereinander und möchte sie an verschiedenne positionen haben !wenn ich aber beide hinschreibe ...befinden die texte sich untereinander!
Hilfe was kann ich da machen damit die beiden sich nicht gegenseitig behindern !
mfg
mambooo

Zitat

<div style="position:absolute; left:390px; top:300px">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td></td>

<td><h1>Herzlich Willkommen auf Blaba Homepage</h1></td>
</tr>
<tr>

<div style="position:absolute; left:390px; top:1900px">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td></td>
<td>Impressum</td>
</tr>
<tr>

Alles anzeigen

Jan_K

versteh ich grad nicht.
bei deinen positionsangaben ist doch klar, dass die sich untereinander befinden. du positionierst den zweiten div-bereich ja 1600px weiter unten als den ersten.

mamboobamboo

ne ....ich habe die beiden so wie ich sie gepost habe geschrieben ...aber wenn ich das schreibe sind die beiden an der selbe stelle ..die behindern sich gegenseitig irgentwie ....also muss man irgentwie ein befehl reinschreiben der die box abschließ!oder ? obwohl die ja eigentlich schon da is !

Jan_K

ähm, natürlich muß man jeden div-bereich auch wieder schließen. ist das da dein ganzer quellcode?? ich dachte du hättest da was rauskopiert in der mitte um nur relevante stellen zu zeigen.

mamboobamboo

nein mein ganzes script is das:

Zitat

<?xml version="1.0" encoding="iso-8859-1"?>
<!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" xml:lang="de" lang="de">
<head>
<title>Chumbawamba</title>
<meta name="generator" content="Scribe! 2 [http://scribe.de]" />
</head>

<center>

</center>

<br /

</p>

<div style="position:absolute; left:390px; top:300px">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td></td>

<td><h1>Herzlich Willkommen auf Blabla Homepage</h1></td>
</tr>
<tr>

<div style="position:absolute; left:390px; top:190px">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td></td>
<td>Impressum</td>
</tr>
<tr>

</body>
</html>

Alles anzeigen

Weiß jemand die lösung ??

driver

wie solln se denn sonst sein ? nebeneinander ?

oder soll sich einfach die unter "wegschieben" sobald in der oberen mehr text kommt ?

mamboobamboo

nein es sollen 2 getrennte boxen sein ,dei man getrennt von einander verschieben kann ...im mom funktioniert das nicht ...sie sin irgentwie eine box !!Ja nebeneinander ,bereinader,so wie man eben die box plaziert !teste halt das script selber !Weil ich weiß nicht weiter wie das gehen soll ! würde ein "div" das problem lösen ??wen ja wo und wie oft ??
mfg
mamboobamboo

driver

äh.... die man verschieben kann ? also wenn du willst dass ma die boxen
als endanwender verschieben kann, musste eh mit javascript arbeiten..

ansonsten schau mal nach dem float-befehl in css

mamboobamboo

ne das geht aber auch so ...ich will die box verschieben kann ...genau wie die ..nur dass die beiden sich nich behindern ....da muss es doch ne möglichkeit geben !

Gebby

Das ist das ganze Script? Wo fängt dein <body> an? 'Tidy' gibt dazu folgende Fehler raus:

HTML

Tidy (vers 30th April 2000) Parsing "C:\DOKUME~1\pfad\LOKALE~1\Temp\HTM7DD.tmp"
line 3 column 1 - Warning: <html> has XML attribute "xml:lang"
line 21 column 6 - Warning: 
 unknown attribute value "(null)"
line 21 column 6 - Error: 
 missing '>' for end of tag
line 26 column 1 - Warning: <table> lacks "summary" attribute
line 35 column 1 - Warning: <div> isn't allowed in <tr> elements
line 36 column 1 - Warning: <table> lacks "summary" attribute
line 49 column 1 - Warning: trimming empty <tr>
line 49 column 1 - Warning: missing </table> before </body>
line 51 column 1 - Warning: missing </div>
line 51 column 1 - Warning: trimming empty <tr>
line 51 column 1 - Warning: missing </table>
line 51 column 1 - Warning: missing </div>

Alles anzeigen

Solltest du nochmal drüber reflektieren
MfG

Interessant das Tidy noch nichtmal den fehlenden <body> erwähnt, oder?

mamboobamboo

hi
danke für die hilfe ....habe gerade versucht die fehler auszubessern ...aber da verscheibt sich die schrift komplett...kann jemand mir meine script verbessern un dann posten ?
mfg

sejuma

Code

<div style="position:absolute; left:390px; top:300px">

Code

<div style="position:absolute; left:390px; top:190px">

Die Ursache liegt in der absoluten Positionierung. Die solltest du komplett weglassen, weil sonst die Boxen aus dem Fluss genommen sind und sich gegenseitig überlagern können..

So wie das jetzt dasteht soll wohl die Box mit 190px über der von 300px stehen.

Das wäre viel eleganter so zu lösen:

Code

<div style="margin-left: 390px; margin-top: 190px;"> ...</div>
<div style="margin-left: 390px;">..</div>

Hier ordnet sich die zweite unmittelbar unter der ersten an.
Wenn sie von der ersten noch etwas Abstand haben soll, dann gib ihr noch ein paar Pixel margin-top.

Ob der Leftabstand von 390px sinnvoll ist bezweifle ich. Vermutlich willst du damit eine Art Zentrierung vornehmen, die dann aber nur an deinem individuellen Bildschirm klappt.
Besser wäre eine Zentrierung (falls das gewollt ist) damit: http://www.ohne-css.gehts-gar.net/0001.php

mamboobamboo

wie läuft das jetzt ?

Zitat

<div style="margin-left: 390px; margin-top: 190px;"> HIER DER INHALT????</div>
<div style="margin-left: 390px;">..</div>

So??kann ich dann die box position definieren ??wenn ja wo ?ich seh das im mom so das ich die größe der box definiere !oder ?

driver

nein, margin ist der außenabstand zum rand.
größe is height bzw width...

sejuma

mamboobamboo,

werde dir mal zunächst darüber klar, wie deine Seite aussehen soll.
Danach kannst du Größe und Position der einzelnen Elemente definieren.

Hier mal ein gängiges Layoutbeispiel, das du ggf. deinen Vorstellungen anpassen kannst.

Etwas Theorie und Verständnis (Lernaufwand) gehört allerdings auch dazu.

Tags