Probleme mit float/overflow bei appendChild

[Eik]

Hallo,

ich habe eine Funktion geschrieben, welche neue Div-elemente erstellt und diese in ein Ziel-Div einfügt.

Das erstellen und einfügen ( via appendChild() ) ind das Ziel-Div funktioniert.

Was nicht funktioniert ist:

Die ( overflow ) Einstellung des Ziel-Divs.(scroll)
und
Die ( float )   Eigenschaft des neuen Divs.

Die Divs werden nur erstellt und untereinander gereiht ... das Ziel-Div passt sich in keinster Weise dem neuen Element an.

-----

Funktioniert so etwas grundsätzlich nicht ?

Oder hängt das damit zusammen, dass das Zieldiv leer ist ?

----

Habe vorerst keinen Code gepostet da es ja erstmal darum geht ob so etwas überhaupt möglich ist.

Vielen Dank im Voraus.

[ChrisB]

Hi,

Funktioniert so etwas grundsätzlich nicht ?

Doch.

Oder hängt das damit zusammen, dass das Zieldiv leer ist ?

Vermutlich nicht.

Habe vorerst keinen Code gepostet da es ja erstmal darum geht ob so etwas überhaupt möglich ist.

Na dann, jetzt aber.

MfG ChrisB

[Eik]

Okay.

In Html gibt es ein Formular zum eingeben der Werte für die neue Box. Per ( onClick ) wird die Funktion zum erstellen aufgerufen ->

  
function newBox()  
{  
  
//Variablen einlesen  
  
if (weite == '' || hoehe == '')  
   {  
   alert('width und height müssen einen wert enthalten!');  
   }  
  
   else  
      {  
      box = document.createElement('DIV');  
      box.style.width = weite;  
      box.style.height = hoehe;  
      box.style.backgroundColor = 'white';  
      box.style.float = 'left';  
      document.getElementById('ziel').appendChild(box);  
      alert(document.getElementById('ziel').innerHTML);  
      }  
}  

Zielobjekt sieht so aus ->

<div id="ziel" class="kontent"></div>
overflow:scroll; per ext. css festgelegt.

-----

Ist alles noch recht einfach da ich mich erstmal rantasten muss .

[ChrisB]

Hi,

box.style.float = 'left';

float ist ein reserviertes Wort in JavaScript, deshalb musst du hier cssFloat nehmen. http://de.selfhtml.org/javascript/objekte/style.htm#style_eigenschaften

MfG ChrisB

[Eik]

Danke!

float ist ein reserviertes Wort in JavaScript, deshalb musst du hier cssFloat nehmen. http://de.selfhtml.org/javascript/objekte/style.htm#style_eigenschaften

Leider hat es mit cssFloat nicht funktioniert ... habe aber noch eine andere Quelle konsultiert ... dort gab es styleFloat das hat letztendlich funktioniert.

mfG Eik

[Eik]

Leider hat es mit cssFloat nicht funktioniert ... habe aber noch eine andere Quelle konsultiert ... dort gab es styleFloat das hat letztendlich funktioniert.

Sorry das war jetzt auch nicht ganz richtig ... denn:

styleFloat - ie
cssFloat - Firefox

[Eik]

Leider hat es mit cssFloat nicht funktioniert ... habe aber noch eine andere Quelle konsultiert ... dort gab es styleFloat das hat letztendlich funktioniert.

Sorry das war jetzt auch nicht ganz richtig ... denn:

styleFloat - ie
cssFloat - Firefox

[ChrisB]

Hi,

Leider hat es mit cssFloat nicht funktioniert ... habe aber noch eine andere Quelle konsultiert ... dort gab es styleFloat das hat letztendlich funktioniert.

Sorry das war jetzt auch nicht ganz richtig ... denn:

styleFloat - ie
cssFloat - Firefox

Besser wäre es, wenn du die Eigenschaften gar nicht erst per JavaScript setzt, sondern das ins Stylesheet der Seite auslagerst.

Da reicht der Nachfahrenselektor, wenn du alle DIVs, die du in das übergeordnete DIV reinsetzt, entsprechend formatieren willst; oder du vergibst per JavaScript den Elementen eine Klasse.

Dann hast du auch Logik (JavaScript) und Präsentation (CSS) sauberer getrennt.

MfG ChrisB