✔ Zeilenumbruch verhindern...

123123123

123123123

Erfahrenes Mitglied
Hey! :)

Kann man in Javascript auch ein Zeilenumbruch verhindern? So der Code:

Code: 
<div id="contentBox"></div>
	<script>
		var Tiere = new Array ();

			Tiere[0] = " Hahn";
			Tiere[1] = " Hund";
			Tiere[2] = " Schwein";
			Tiere[3] = " Ratte";
			Tiere[4] = " Büffel";
			Tiere[5] = " Tiger";
			Tiere[6] = " Hase";
			Tiere[7] = " Drache";
			Tiere[8] = " Schlange";
			Tiere[9] = " Pferd";
			Tiere[10] = " Schaf";
			Tiere[11] = " Affe";
		
		var datum = new Date();
		var jahr = datum.getFullYear();

		for(i=jahr-40; i<=jahr+40; i++)
		{
			var tierIndex = (i-1885)%12;
			//document.write (i + ": " + Tiere[tierIndex] + "<br>");
			var oJahr = document.createElement("div");
			var oJahrText = document.createTextNode(i);
				oJahr.appendChild(oJahrText);
			
			var Ausgabe = document.getElementById("contentBox");
				Ausgabe.appendChild(oJahr);
				
			var oTiere = document.createElement("div");
			var oTiereText = document.createTextNode(": " + Tiere[tierIndex]);
				oTiere.appendChild(oTiereText);
				
			var Ausgabe = document.getElementById("contentBox");
				Ausgabe.appendChild(oTiere);
		}
	</script>

Die Tiernamen müssen hinter das Jahr stehen. Thanks! :)
 
Ein fiddle hilft immer weiter ;) http://jsfiddle.net/AM29u/
In der Ausgabe siehst Du, dass Du zwei Divs erstellst, welche per Standard nicht nebeneinander liegen. Also entweder packst Du beide Daten (Tier und Datum) in eine Div oder Du gibst den Divs per CSS die Anweisung nebeneinander zu liegen ;)

mfg chmee
 
Zuletzt bearbeitet:
Da sind keine Zeilenumbrüche, du machst ganz viele DIV Elemente, die sich als Block-Elemente untereinander anordnen.

Machs doch so in der Art

Javascript: 
var Tiere = ["Hahn", "Hund", "Schwein", "Ratte", "Büffel", "Tiger", "Hase", "Drache", "Schlange", "Pferd", "Schaf", "Affe"];
var jahr = new Date().getFullYear();
var out = "";

for(var i = jahr - 40; i < jahr + 40; i++) {
	var tierIndex = (i - 1885) % 12;
	
	out += i;
	out += ": ";
	out += Tiere[tierIndex];
	out += "<br>";
}

document.getElementById("contentBox").innerHTML = out;
 
Ok, ich habe jetzt mit sowas probiert, aber es geht nicht :(
HTML: 
<div class= "div" style="float: left;"></div>
Ich wollte diesen ("div")s einfach eine gemeinsame "div class" machen, warum klappt das nicht?
 
Versuch mal folgendes

Javascript: 
//...
var oJahr = document.createElement("div");

//Neue Zeile
oJahr.className = 'left';

var oJahrText = document.createTextNode(i);
//...

und

CSS: 
.left {
    float:left;
}
 
Kein Wunder, dass das mit "float:left" alleine nicht funktioniert. Deine Divs haben immer noch 100% Breite. Du musst beiden Teilen eines Paares jeweils eine Breite geben (ob nun % oder px ist egal), die zusammen 100% der Breite des Elternelementes ergeben...
 
Also bei mir klappt das nicht! :(
Die Elemente reagieren gar nicht auf die "div class". Was mache ich den falsch!
Hab auch genau so gemacht wie ' CPoly '.
 
Ich kopiere mal mein ganzes HTML Dokument

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
	
	<title>Zoo</title>
	
	<style type="text/css">
	.left {
		float:left;
	}
	</style>
</head>

<body>
	<div id="contentBox"></div>
    <script type="text/javascript">
    /* <![CDATA[ */
	var Tiere = new Array ();
 
            Tiere[0] = " Hahn";
            Tiere[1] = " Hund";
            Tiere[2] = " Schwein";
            Tiere[3] = " Ratte";
            Tiere[4] = " Büffel";
            Tiere[5] = " Tiger";
            Tiere[6] = " Hase";
            Tiere[7] = " Drache";
            Tiere[8] = " Schlange";
            Tiere[9] = " Pferd";
            Tiere[10] = " Schaf";
            Tiere[11] = " Affe";
        
        var datum = new Date();
        var jahr = datum.getFullYear();
 
        for(i=jahr-40; i<=jahr+40; i++)
        {
            var tierIndex = (i-1885)%12;
            //document.write (i + ": " + Tiere[tierIndex] + "<br>");
            var oJahr = document.createElement("div");
            oJahr.className = 'left';
            var oJahrText = document.createTextNode(i);
                oJahr.appendChild(oJahrText);
            
            var Ausgabe = document.getElementById("contentBox");
                Ausgabe.appendChild(oJahr);
                
            var oTiere = document.createElement("div");
            var oTiereText = document.createTextNode(": " + Tiere[tierIndex]);
                oTiere.appendChild(oTiereText);
                
            var Ausgabe = document.getElementById("contentBox");
                Ausgabe.appendChild(oTiere);
        }
    /* ]]> */
    </script>
</body>

</html>
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück