dieselross: Fließendes Layout: zwei flexible Textspalten?

SELF-Forum

Fließendes Layout: zwei flexible Textspalten?

dieselross
– Informationen zu den Bewertungsregeln

Moin,

ist es möglich, in einem umgebenden Container (div) zwei gleich breite Spalten anzuordnen (ebenfalls als div's), die sich flexibel der Fensterbreite anpassen (per Prozentangabe). Ich möchte erreichen, daß ein zweispaltiges Layout innerhalb eines Containers, der seinerseits auf 80% der Fensterbreite festgelegt ist frei fließt, dabei aber harmonusch ausgewogen bleibt.

Gruß
dieselross

--
- life's for learning -
Ceterum censeo IE esse delendam
Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Fließendes Layout: zwei flexible Textspalten?

    suit Homepage des Autors
    – Informationen zu den Bewertungsregeln

    ist es möglich, in einem umgebenden Container (div) zwei gleich breite Spalten anzuordnen (ebenfalls als div's), die sich flexibel der Fensterbreite anpassen (per Prozentangabe).

    Ja, ist melgich zu erschlagen Ehemann mit Handtuch - wenn Handtuch gefillt mit Bigeleisen[1].

    Gib den inneren Elementen auch eine jeweils eine prozentuelle Breitenangabe - in Summe solltest du 100 nicht überschreiten ;).

    Ich möchte erreichen, daß ein zweispaltiges Layout innerhalb eines Containers, der seinerseits auf 80% der Fensterbreite festgelegt ist frei fließt, dabei aber harmonusch ausgewogen bleibt.

    Viel Spass dabei :)

    [1] böhmischer Akzent :p

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Fließendes Layout: zwei flexible Textspalten?

      dieselross
      – Informationen zu den Bewertungsregeln

      [1] böhmischer Akzent :p

      Dein behmisch ist beeeindruckend. ;-)

      Thx für die schnelle Antwort.
      Irgendwie hatte ich so 'was auch schon gedacht, aber irgendwie klappt das nicht recht. Ich muß mal den Code durchforsten heute abend und dann hier einstellen. Irgendwas mach' ich falsch.

      Gruß
      dieselross

      --
      - life's for learning -
      Ceterum censeo IE esse delendam
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Fließendes Layout: zwei flexible Textspalten?

        dieselross
        – Informationen zu den Bewertungsregeln

        Nachtrag:

        ich brauche auch noch ein min-width, damit mir bei kleinen Fensterbreiten das Layout nicht durcheinanderrutscht. Aber da schiebt's mir dann background-Elemente des umgebenden divs aus dem Layout 'raus.

        Gruß
        dieselross

        --
        - life's for learning -
        Ceterum censeo IE esse delendam
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. Fließendes Layout: zwei flexible Textspalten?

          suit Homepage des Autors
          – Informationen zu den Bewertungsregeln

          ich brauche auch noch ein min-width, damit mir bei kleinen Fensterbreiten das Layout nicht durcheinanderrutscht. Aber da schiebt's mir dann background-Elemente des umgebenden divs aus dem Layout 'raus.

          Das musst du herzeigen - kann mir drunter nix vorstellen :)

          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

          1. Fließendes Layout: zwei flexible Textspalten?

            dieselross
            – Informationen zu den Bewertungsregeln

            Das musst du herzeigen - kann mir drunter nix vorstellen :)

            Ich hoffe, das wird jetzt nicht zu viel. Und ich hoffe auch sehr, das verdeutlicht mein Problem.

            CSS:

            body {  
	background-image:url('../media/BodyBG.jpg');  
	padding:0;  
	margin:0;  
	font-family:Arial, Helvetica, sans-serif;  
	font-size:101%;  
}  
#Frame {  
	display:block;  
	width:80%;  
	min-width:740px;  
	min-height:400px;  
	background-color:#ffffff;  
	margin-left:auto;  
	margin-right:auto;  
}  
#Header {  
	display:block;  
	width:100%;  
	height:70px;  
	background-image:url('../media/FrameTop.jpg');  
	background-repeat:repeat-x;  
}  
#HeaderLeft {  
	display:inline-block;  
	width:40px;  
	height:70px;  
	background-image:url('../media/FrameUL.jpg');  
	background-repeat:no-repeat;  
	position:relative;  
	float:left;  
}  
#HeaderRight {  
	display:inline-block;  
	width:40px;  
	height:70px;  
	background-image:url('../media/FrameUR.jpg');  
	background-repeat:no-repeat;  
	position:relative;  
	float:right;  
}  
#Navigation {  
	display:block;  
	width:100%;  
	min-width:400px;  
	height:75px;  
	background-image:url('../media/NavBG.jpg');  
	background-repeat:repeat-x;  
}  
#NavigationLeft {  
	display:inline-block;  
	width:70px;  
	height:75px;  
	background-image:url('../media/NavL.jpg');  
	background-repeat:no-repeat;  
	position:relative;  
	float:left;  
}  
#NavTabs {  
	display:inline-block;  
	position:relative;  
	left:0px;  
	top:-16px;  
	width:544px;  
	background-image:url('../media/NavBG.jpg');  
	background-repeat:repeat-x;  
}  
#NavigationRight {  
	display:inline-block;  
	width:70px;  
	height:75px;  
	background-image:url('../media/NavR.jpg');  
	background-repeat:no-repeat;  
	position:relative;  
	float:right;  
}  
#MainBlock {  
	display:block;  
	width:100%-80px;  
	height:100%;  
	min-width:400px;  
	min-height:400px;  
}  
#MainLeft {  
	display:inline-block;  
	width:40px;  
	height:100%;  
	min-height:400px;  
	background-image:url('../media/FrameL.jpg');  
	background-repeat:repeat-y;  
	position:relative;  
	float:left;  
}  
#MainRight {  
	display:inline-block;  
	width:40px;  
	height:100%;  
	min-height:400px;  
	background-image:url('../media/FrameR.jpg');  
	background-repeat:repeat-y;  
	position:relative;  
	float:right;  
}  
#ContentArea {  
	display:inline-block;  
	position:relative;	  
	width:100%;  
	min-width:400px;  
	min-height:400px;  
	background-color: blue;  
}  
#ContentLeft {  
	display:inline-block;  
	position:relative;  
	width:49%;  
	min-height:400px;  
	background-color: red;  
}  
#ContentRight {  
	display:inline-block;  
	position:relative;  
	width:49%;  
	float:right;  
	clear:both;  
	min-height:400px;  
	background-color:yellow;  
}  
#Footer {  
	display:block;  
	width:100%;  
	height:70px;  
	background-image:url('../media/FrameBottom.jpg');  
	background-repeat:repeat-x;  
}  
#FooterLeft {  
	display:inline-block;  
	width:40px;  
	height:70px;  
	background-image:url('../media/FrameLL.jpg');  
	background-repeat:no-repeat;  
	position:relative;  
	float:left;  
}  
#FooterRight {  
	display:inline-block;  
	width:40px;  
	height:70px;  
	background-image:url('../media/FrameLR.jpg');  
	background-repeat:no-repeat;  
	position:relative;  
	float:right;  
}  
#Logo {  
	display:inline-block;  
	width:200px;  
	height:40px;  
	position:relative;  
	top:30px;  
	background-image:url('../media/Logo.jpg');  
	background-repeat:no-repeat;  
}	  
.invisible {  
	display: none;  
}  
#homeSpace {  
	display: block;  
	width: 136px;  
	height: 75px;  
	position: absolute;  
	border:0px;  
	left: 0px;  
}  
#homeCurrent {  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTabCurrent.jpg');  
	background-repeat: no-repeat;  
	background-position: center bottom;  
}  
#home:link {  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTab3State.jpg');  
	border:0px;  
	background-repeat: no-repeat;  
	background-position: center top;  
}  
#home:visited {  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTab3State.jpg');  
	border:0px;  
	background-repeat: no-repeat;  
	background-position: center top;  
}  
#home:hover {  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTab3State.jpg');  
	border:0px;  
	background-repeat: no-repeat;  
	background-position: center center;  
}  
#home:active{  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTab3State.jpg');  
	border:0px;  
	background-repeat: no-repeat;  
	background-position: center bottom;  
}  
#galerieSpace {  
	display: block;  
	width: 100px;  
	height: 40px;  
	position: absolute;  
	border:0px;  
	left: 136px;  
}  
#galerieCurrent {  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTabCurrent.jpg');  
	border:0px;  
	background-repeat: no-repeat;  
	background-position: center bottom;  
}  
#galerie:link {  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTab3State.jpg');  
	border:0px;  
	background-repeat: no-repeat;  
	background-position: center top;  
}  
#galerie:visited {  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTab3State.jpg');  
	border:0px;  
	background-repeat: no-repeat;  
	background-position: center top;  
}  
#galerie:hover {  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTab3State.jpg');  
	border:0px;  
	background-repeat: no-repeat;  
	background-position: center center;  
}  
#galerie:active{  
	display: block;  
	width: 136px;  
	height: 75px;  
	background-image:url('../media/NavTab3State.jpg');  
	border:0px;  
	background-repeat: no-repeat;  
	background-position: center bottom;  
}

            HTML:

            <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  
   "http://www.w3.org/TR/html4/loose.dtd">  
  
<html lang="de">  
<head>  
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
	<title>untitled</title>  
	<link rel="stylesheet" href="css/styles.css" type="text/css" media="screen" charset="utf-8">  
	<meta name="generator" content="TextMate http://macromates.com/">  
	<meta name="author" content="Holger Pleus">  
	<!-- Date: 2009-09-04 -->  
</head>  
<body>  
	<div id="Frame">  
		<div id="Header">  
			<div id="HeaderLeft">  
			</div>  
			<div id="Logo">  
			</div>  
			<div id="HeaderRight">  
			</div>  
		</div>		  
		<div id="Navigation">  
			<div id="NavigationLeft">  
			</div>  
			<ul id="NavTabs">  
				<li id="homeSpace">  
					<a id="homeCurrent">  
					<span class="invisible">Home</span></a>  
				</li>  
				<li id="galerieSpace">  
					<a id="galerie" href="#">  
					<span class="invisible">Galerie</span></a>  
				</li>  
			</ul>  
			<div id="NavigationRight">  
			</div>  
		</div>  
		<div id="MainBlock">  
			<div id="MainLeft">  
			</div>  
			<div id="SidebarLeft">  
			</div>  
			<div id="ContentArea">  
				<div id="ContentLeft">  
				</div>  
				<div id="ContentRight">  
				</div>  
			</div>  
			<div id="MainRight">  
			</div>  
		</div>  
		<div id="Footer">  
			<div id="FooterLeft">  
			</div>  
			<div id="FooterRight">  
			</div>  
		</div>  
	</body>  
</html>

            Gruß
            dieselross

            --
            - life's for learning -
            Ceterum censeo IE esse delendam
            Beitrag melden
            –
            Informationen zu den Bewertungsregeln

            1. Fließendes Layout: zwei flexible Textspalten?

              suit Homepage des Autors
              – Informationen zu den Bewertungsregeln

              Ich hoffe, das wird jetzt nicht zu viel. Und ich hoffe auch sehr, das verdeutlicht mein Problem.

              Ich dachte da eher an ein auf das Wesentliche reduziertes Beispiel welches man sich direkt online ansehen kann :)

              Beitrag melden
              –
              Informationen zu den Bewertungsregeln

              1. Fließendes Layout: zwei flexible Textspalten?

                dieselross
                – Informationen zu den Bewertungsregeln

                Ich dachte da eher an ein auf das Wesentliche reduziertes Beispiel welches man sich direkt online ansehen kann :)

                Hat etwas gedauert, weil ich etwas anderes zu tun hatte.
                guckst Du: hier und hier.

                Gruß
                dieselross

                --
                - life's for learning -
                Ceterum censeo IE esse delendam
                Beitrag melden
                –
                Informationen zu den Bewertungsregeln

              2. Fließendes Layout: zwei flexible Textspalten?

                dieselross
                – Informationen zu den Bewertungsregeln

                Nachtrag: Ich habe hierbei den besonderen Macken des Internet-Exploders noch keine Rechnung getragen. Da sieht's völlig Banane aus.
                Erst 'mal möchte ich, daß es in Standardkonformen Brausern richtig funzt. Für IE gibt's vielleicht dann ein Layout mit fixierten Breiten.

                Gruß
                dieselross

                --
                - life's for learning -
                Ceterum censeo IE esse delendam
                Beitrag melden
                –
                Informationen zu den Bewertungsregeln

              3. Fließendes Layout: zwei flexible Textspalten?

                dieselross
                – Informationen zu den Bewertungsregeln

                Ich dachte da eher an ein auf das Wesentliche reduziertes Beispiel welches man sich direkt online ansehen kann :)

                Hattest du schon Gelegenheit, dir meine Beispiele anzusehen? Ich frag' ja nur 'mal so.

                Gruß
                dieselross

                --
                - life's for learning -
                Ceterum censeo IE esse delendam
                Beitrag melden
                –
                Informationen zu den Bewertungsregeln

                1. Fließendes Layout: zwei flexible Textspalten?

                  suit Homepage des Autors
                  – Informationen zu den Bewertungsregeln

                  Hattest du schon Gelegenheit, dir meine Beispiele anzusehen? Ich frag' ja nur 'mal so.

                  Ich hab' den Thread völlig übersehen - sorry.

                  Versuch dein Beispiel weniger komplex zu gestalten, wirf alles weg und beginne Schritt für Schritt von außen nach innen das Ganze neu zu bauen bis der Fehler auftritt.

                  Beitrag melden
                  –
                  Informationen zu den Bewertungsregeln

                  1. Fließendes Layout: zwei flexible Textspalten?

                    dieselross
                    – Informationen zu den Bewertungsregeln

                    Danke für den Hinweis. Ich werd' aber wohl erst nächste Woche wieder dazu kommen. Ich melde mich dann wieder. *droh* ;-)

                    Gruß
                    dieselross

                    --
                    - life's for learning -
                    Ceterum censeo IE esse delendam
                    Beitrag melden
                    –
                    Informationen zu den Bewertungsregeln

                    1. Fließendes Layout: zwei flexible Textspalten?

                      dieselross
                      – Informationen zu den Bewertungsregeln

                      Also hier hab' ich das ganze jetzt 'mal abgespeckt. Ich hoffe, so wird's erkennbar.

                      Gruß
                      dieselross

                      --
                      - life's for learning -
                      Ceterum censeo IE esse delendam
                      Beitrag melden
                      –
                      Informationen zu den Bewertungsregeln

                      1. Fließendes Layout: zwei flexible Textspalten?

                        suit Homepage des Autors
                        – Informationen zu den Bewertungsregeln

                        Also hier hab' ich das ganze jetzt 'mal abgespeckt. Ich hoffe, so wird's erkennbar.

                        Das Layout fällt bereits vorher auseinander (bzw. allgemein ist es fehlerhaft dargestellt - zumindest in Firefox 3 und Opera 9.6) :)

                        ggf. solltest du nochmal von außen nach innen beginnen das Layout Stück für Stück zusammensetzen.

                        Verzichte vorerst auf Hintergrundbilder und verzierung und verwende nur Farben - etwa so könnte das aussehen:

                        <!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>  
		<title>SELFHTML t=190482</title>  
		<style type="text/css">  
			html {  
				padding: 20px;  
				margin: 0;  
				background: #958F7F;  
			}  
			  
			body {  
				margin: 0 auto;  
				padding: 0;  
				min-width: 750px;  
				max-width: 1500px;  
				background: #E4E4E4;  
				position: relative;  
			}  
			  
			.c1, .c2, .c3, .c6 {  
				position: absolute;  
				top: -20px;  
				left: -20px;  
				width: 20px;  
				height: 20px;  
				background: red;  
				overflow: hidden;  
			}  
			  
			.c2 {  
				width: 100%;  
				left: 0;  
				background: green;  
			}  
				  
			.c3 {  
				left: auto;  
				right: -20px;  
				background: yellow;  
			}  
			  
			.c6 {  
				width: 100%;  
				left: 0;  
				top: auto;  
				bottom: -20px;  
				background: magenta;  
			}  
			  
			h1 {  
				padding: 0;  
				margin: 0;  
				background: blue;  
			}  
			  
			#menu {  
				padding: 0;  
				margin: 0;  
				border-bottom: 2px solid red;  
			}  
			  
			#menu:after {  
				content: '.';  
				clear: both;  
				display: block;  
				height: 0;  
				visibility: hidden;  
			}  
			  
			#menu li {  
				padding: 5px;  
				margin: 0;  
				list-style: none;  
				float: left;  
				background: cyan;  
			}  
			  
		</style>  
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>  
		<script type="text/javascript">  
			// <![CDATA[  
				jQuery.noConflict();  
				jQuery(document).ready(function(){  
					jQuery('div#content>div:not(:first-child)').css('display', 'none');  
					jQuery('ul#menu>li').bind(  
						'click',  
						function() {  
							var index = jQuery('li').index(this);  
							jQuery('div#content>div').css('display', 'none');  
							jQuery('div#content>div:eq(' + index + ')').css('display', 'block');  
							  
						}  
					);  
				  
				});  
  
			// ]]>  
		</script>  
	</head>  
	<body>  
		<h1>re-ality</h1>  
		<ul id="menu">  
			<li>Tab 1</li>  
			<li>Tab 2</li>  
			<li>Tab 3</li>  
		</ul>  
		<div id="content">  
			<div id="tab1">  
				<h2>überschrift, tab1</h2>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
			</div>  
			<div id="tab2">  
				<h2>überschrift, tab2</h2>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
			</div>  
			<div id="tab3">  
				<h2>überschrift, tab3</h2>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
				<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
			</div>  
		</div>  
		<div class="c1">ecke links oben</div>  
		<div class="c2">kante oben</div>  
		<div class="c3">rechts oben</div>  
		<div class="c6">kante unten</div>  
	</body>  
</html>
                        Beitrag melden
                        –
                        Informationen zu den Bewertungsregeln

                        1. Fließendes Layout: zwei flexible Textspalten?

                          dieselross
                          – Informationen zu den Bewertungsregeln

                          Also hier hab' ich das ganze jetzt 'mal abgespeckt. Ich hoffe, so wird's erkennbar.

                          Das Layout fällt bereits vorher auseinander (bzw. allgemein ist es fehlerhaft dargestellt - zumindest in Firefox 3 und Opera 9.6) :)

                          ggf. solltest du nochmal von außen nach innen beginnen das Layout Stück für Stück zusammensetzen.

                          Hmmm. Das hatte ich versucht. Irgendwie ist bei meiner kompletten Planung offenbar der Wurm drin.

                          Verzichte vorerst auf Hintergrundbilder und verzierung und verwende nur Farben - etwa so könnte das aussehen:

                          |
                          Ich hab' mir dein Beispiel angesehen. Ich komme allerdings nicht so richtig klar. Was soll das Java-Zeugs da drin? Und wie soll ich in der unteren Kante, die ja mit dem Hauptblock eine Breite hat, meine linke und rechte untere Ecke unterbringen?

                          Gruß
                          dieselross

                          --
                          - life's for learning -
                          Ceterum censeo IE esse delendam
                          Beitrag melden
                          –
                          Informationen zu den Bewertungsregeln

                          1. Fließendes Layout: zwei flexible Textspalten?

                            suit Homepage des Autors
                            – Informationen zu den Bewertungsregeln

                            Ich hab' mir dein Beispiel angesehen. Ich komme allerdings nicht so richtig klar. Was soll das Java-Zeugs da drin?

                            Das JavaScript-Zeug ist dafür da, dass man "Seitenwechsel" simulieren kann, ich wollte dir eine 1:1 Kopiervorlage in die handdrücken und nicht 5 Dokumente :)

                            Und wie soll ich in der unteren Kante, die ja mit dem Hauptblock eine Breite hat, meine linke und rechte untere Ecke unterbringen?

                            So wie ich das mit den anderen Ecken und Kanten auch gemacht habe - ich hab' nur nicht alle ausgeführt. die divs mit den klassen .c1 bis .c8 sind dafür zuständig - im Beispiel sind aber nur ein paar enthalten.

                            Beitrag melden
                            –
                            Informationen zu den Bewertungsregeln