Beiträge von AnonymusChaotic

AnonymusChaotic · 4. Januar 2016

Es kann übrigens das Problem auch im Webserver versteckt liegen, das hatte ich mal. Was ich dann genau geändert habe damit es funktioniert weiß ich nicht mehr.

AnonymusChaotic · 20. Dezember 2015

bluefish unter Linux debian

AnonymusChaotic · 13. Dezember 2015

Einmal vorweg: ich bin absoluter JS-Anfänger!

Google zeigt in seinem Beispiel https://googlesamples.github.i…/patterns/off-canvas.html dass bei ausreichend schmalem Browserfenster die Seitenleisten verschwinden.

Klickt man auf die mittelblaue div geht zuerst die linke, dann die rechte div auf und die linke zu, dann die linke zu und anschließend alles wieder von vorne.

Soweit, sogut.

Will ich aber die rechte Div entfernen und den Vorgang auf zwei Klicks reduzieren, funktioniert das auch halbwegs gut, nach zwei Klicks ist aber Schluss mit der Animation.

Mein Code sieht dazu so aus:

JavaScript

var position = 0;
      var mainPanel = document.getElementById("mainPanel");
      var leftDrawer = document.getElementById("leftDrawer");
		console.log("start");




      function toggle(evt) {
        position++;
          if (position == 1) {
          leftDrawer.classList.add("open");
          console.log("2");
        } else {
          leftDrawer.classList.remove("open");
          console.log("3");




        }  
      }

      mainPanel.addEventListener("click", toggle);
      leftDrawer.addEventListener("click", toggle);

Alles anzeigen

Warum wiederholt sich der Ablauf der Funktion bei Google und bei mir nicht?

So funktioniert es auch bei mir:

JavaScript

var position = 0;
      var mainPanel = document.getElementById("mainPanel");
      var leftDrawer = document.getElementById("leftDrawer");
		console.log("start");




      function toggle(evt) {
        position++;
			 if (position == 1) {
          leftDrawer.classList.add("open");
          console.log("2");
        } else {
          leftDrawer.classList.remove("open");
          console.log("3");
          position = 0;
        }  
      }

      mainPanel.addEventListener("click", toggle);
      leftDrawer.addEventListener("click", toggle);


    </script>

Alles anzeigen

Der originale Googlecode:

JavaScript

JS aus https://googlesamples.github.io/web-fundamentals/samples/fundamentals/design-and-ui/responsive/patterns/off-canvas.html




   var position = 0;
      var mainPanel = document.getElementById("mainPanel");
      var leftnav = document.getElementById("leftDrawer");
      var rightDrawer = document.getElementById("rightDrawer");




      function toggle(evt) {
        position++;
        if (position % 3 == 0) {
          leftDrawer.classList.remove("open");
          rightDrawer.classList.remove("open");
        } else if (position % 3 == 1) {
          leftDrawer.classList.add("open");
          rightDrawer.classList.remove("open");
        } else {
          leftDrawer.classList.remove("open");
          rightDrawer.classList.add("open");
        }  
      }




      mainPanel.addEventListener("click", toggle);
      leftDrawer.addEventListener("click", toggle);
      rightDrawer.addEventListener("click", toggle);

Alles anzeigen

Zitat von https://developers.google.com/web/

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the Apache 2.0 License. For details, see our Site Policies.

Zuletzt aktualisiert am Dezember 10, 2015

AnonymusChaotic · 13. Dezember 2015

Danke, funktioniert!

AnonymusChaotic · 13. Dezember 2015

nachdem man möglichst wenige Angaben vom HTML-Formular übernehmen sollte; jede Eingabe kann von böswilligen Usern manipuliert werden.

Wenn Du sowieso ein pdf erstellst, kannst Du dort mit Echo die Zeit reinschreiben lassen, ähnlich dem hier beschriebenen Verfahren: http://www.schattenbaum.net/php/datum.php .

AnonymusChaotic · 13. Dezember 2015

I'm sorry, das war ein Kopierfehler. Mein Editor (bluefish) kann Elemente einklappen, zeigt das aber nicht immer zu 100% korrekt an. heißt: Der HTML-Code ist bis auf die vielfache Verwendung der ids im Footer und die (noch) leeren ID-Definitionen in den Elementen durchaus valide.

Hier noch mal vollständig kopiert:

HTML

<!DOCTYPE html>
<html lang="de">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="style/style.css" type="text/css" rel="stylesheet" />
		<link rel="icon" href="/sys_img/favicon.ico">
		<title>MinecraftServerAdmin.net</title>

	</head>	
	<body>
	<script type="text/javascript"> 
	   var position = 0;
      var mainPanel = document.getElementById("mainPanel");
      var leftDrawer = document.getElementById("leftDrawer");
      var rightDrawer = document.getElementById("rightDrawer");




      function toggle(evt) {
        position++;
        if (position % 3 == 0) {
          leftDrawer.classList.remove("open");
          rightDrawer.classList.remove("open");
        } else if (position % 3 == 1) {
          leftDrawer.classList.add("open");
          rightDrawer.classList.remove("open");
        } else {
          leftDrawer.classList.remove("open");
          rightDrawer.classList.add("open");
        }  
      }




      mainPanel.addEventListener("click", toggle);
      leftDrawer.addEventListener("click", toggle);
      rightDrawer.addEventListener("click", toggle);

    </script>




		<nav class="" id="">
					<div><h1 id="logo">MinecraftServer<br />Admin.net</h1></div>
					<ul class="nav_list">
						<li class="nav_list_element" id="nav_list_element1"><a class="nav_link_element">Lorem Ipsum</a></li>
						<li class="nav_list_element" id="nav_list_element2"><a class="nav_link_element" href="http://google.at/">Lorem Ipsum</a></li>
						<li class="nav_list_element" id="nav_list_element3"><a class="nav_link_element">Lorem Ipsum</a></li>
						<li class="nav_list_element" id="nav_list_element4"><a class="nav_link_element">Lorem Ipsum</a></li>
						<li class="nav_list_element" id="nav_list_element5"><a class="nav_link_element">Lorem Ipsum</a></li>
						<li class="nav_list_element" id="nav_list_element6"><a class="nav_link_element">Lorem Ipsum</a></li>
						<li class="nav_list_element" id="nav_list_element7"><a class="nav_link_element">Lorem Ipsum</a></li>


					</ul>
		</nav>




		<div class="" id="bigcontentarea">
				<header class="tabellen_zelle" id="">
						<h1>   
						<a class="menue-button menue-button-beschr-close" href="#nav-menue-zu">MENÜ zu</a>
						<a class="menue-button menue-button-beschr-open" href="#nav-menue">MENÜ auf</a>
						Minecraftadmin.net </h1>
				</header>




				<article class="tabellen_zelle maximale_hoehe" id="article">
					<h1>Lorem ipsum dolor sit amet,</h1>
					<p>consecteteur. Gravida, donec nam facilisi convallis. Morbi ornare. Dis fusce aliquam ultricies, duis nec. Mi rutrum et, eleifend posuere elit enim faucibus torquent. Nascetur urna et ipsum interdum et, vitae malesuada. Netus donec nostra ve sociis primis, fringilla aliquet ornare non in montes. Porttitor cras sem sociosqu vitae eros aliquam cras, porttitor eu malesuada. Bibendum, nibh mollis hymenaeos justo consequat faucibus volutpat ipsum. Sem.</p>
					<p>Ac morbi in nibh, class, dignissim. Rutrum duis per cras sit neque gravida platea, elit enim rutrum quisque orci. Per in class ve. Neque vestibulum nisi nulla. Nunc. Feugiat vel. Massa, pede ac consectetuer congue curae parturient. Ante elit dapibus magna est posuere ve. Malesuada pellentesque nonummy curabitur duis mus augue cubilia. Imperdiet lorem tristique nisi gravida mi, congue. Condimentum per, at. Egestas accumsan morbi feugiat in consequat ullamcorper, fringilla enim quisque et fermentum. Quisque.</p>
					<p>Semper cursus pharetra est viverra metus id montes. Nec, justo habitasse vestibulum nunc purus congue congue proin nec erat ridiculus elit nullam massa ornare. Eros, non justo per dolor leo neque. Est enim non leo nam at facilisi lacinia. Aliquam. Nibh mus nisi adipiscing platea id interdum laoreet natoque rutrum est at. Sem. Gravida ridiculus non neque natoque accumsan risus urna lectus, euismod elementum sem vitae metus, sed. Aliquet in, ac dui fringilla. Ornare hendrerit dictumst. Quam nec class sociis vestibulum nulla. Euismod, cras semper varius bibendum. Mus, lacinia at, sed nunc parturient sem parturient parturient. Morbi varius duis, mauris id torquent feugiat felis magna dis molestie.</p>




				</article>




				<footer class="tabellen_zelle" id="">




					<ul>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>

					</ul>

				</footer>	
		</div>
	</body>













</html>

Alles anzeigen

So sieht die Seite dann im Browser aus (habe im CSS noch den Bereich #bigcontentarea grün gefärbt, um zu demonstrieren, dass der tatsächlich die volle höhe einnimmt)
Die Navigation hat auch noch ein bisschen Design bekommen.

Hier noch mal der CSS-Code:

CSS

*{
	margin: 0;
	padding: 0;
	font-family: Arial, sans-serif;
   box-sizing: border-box;
}




html, body {
	height: 100%;
}




body {
	display: table;
	width: 100%;
	background-color: gray;
}




nav {
	float: left;
	width: 200px;
	height: 100%;
	overflow-y: auto; /* scrollbarkeit */
	background-color: silver;

}
#bigcontentarea {
width: calc(100% - 200px);




	float: left;
	min-height: 100%;
	background-color: green;
}
header {
	padding: 1em;
	background-color: yellow;




}
#article {
	    background-color: orange;
}
footer {
		padding: 0.7em;
		background-color: pink;
}
.tabellen_zelle {
    display: table-row;




}




.maximale_hoehe {
    height: 100%;
    background-color: deepskyblue;
}




#logo {
	color: red;
	background-color: gray;

}




/*mobile Steuerung*/
.menue-button {
 	display: none;
}




/* Navigation */
.nav_list_element {
	list-style: none;
	padding: 0.7em;




	
}
.nav_link_element {
	text-decoration: none;
	font-weight: 700;
}
.nav_link_element:visited {
	color: gray;
	text-decoration: none;
}




.nav_link_element:active {
	color: gray;
	text-decoration: none;
}
















#nav_list_element1 {
	border-left: 10px #CC0000 solid;
} 
#nav_list_element1:hover {
	background-color: #CC0000;
	color: white;
}







#nav_list_element2 {
	border-left: 10px #FF7200 solid;
} 
#nav_list_element2:hover {
	background-color: #FF7200;
	color: white;
}




#nav_list_element3 {
	border-left: 10px #FFBB0D solid;
} 
#nav_list_element3:hover {
	background-color: #FFBB0D;
	color: white;
}




#nav_list_element4 {
	border-left: 10px #1B8500 solid;
} 
#nav_list_element4:hover {
	background-color: #1B8500;
	color: white;
}










#nav_list_element5 {
	border-left: 10px #D800FF solid;
} 
#nav_list_element5:hover {
	background-color: #D800FF;
	color: white;
}













#nav_list_element6 {
	border-left: 10px #160CFA solid;
} 
#nav_list_element6:hover {
	background-color: #160CFA;
	color: white;
}










#nav_list_element7 {
	border-left: 10px #0099FF solid;
} 
#nav_list_element7:hover {
	background-color: #0099FF;
	color: white;
}







footer li {
	list-style: none;
	float: left;
	display: block;
	padding: 0.7em;
	background-color: red;
}

Alles anzeigen

Zitat von MrMurphy

Bei % muss man aber immer bedenken, wovon die % genommen werden sollen. Bei height von der Höhe des umgebenden Elements. Wenn das nicht die gesamte Bildschirmhöhe ausfüllt kann das innenliegende mit der 100%-height-Angabe das auch nicht. Du musst also dafür sorgen, dass alle umgebenden Elemente (Eltern- , Großelternelemente u.s.w.) bereits über die gewünschte Höhe verfügen.

Insgesamt kann in deinem Beispiel die Sticky Footer-Methode mit display:table nicht funktionieren. #bigcontentarea zerstört die Tabellenkonstruktion.

Weshalb? Ich müsste doch theoretisch in jeder! Div einen Sticky footer nach dem oben verlinkten Tutorial machen können? Und bigcontentarea IST groß genug. Auch wenn ich #bigcontentarea sage, dass es auch eine tabellenreihe sein soll, ändert das nichts.

und wie könnte ich das sonst lösen? beim klassischen würde ich mir ja das mobile Design zerstören, sonst gäbe es ja kein Tutorial für ein extra mobiles design.

AnonymusChaotic · 13. Dezember 2015

Ich habe definitiv keine Ahnung von PHP, aber ich habe immer wieder mit Apache zu tun, auf einem eigenen Server. Wenn ich mich recht erinnere, gibt es entweder eine Möglichkeit, das einbinden von Daten aus anderen Servern zu unterbinden, weil so eine Menge Unfug eingeschleust werden könnte oder das ist von Haus aus unterbunden und kann aktiviert werden.

Bei einem eigenen Webserver sollte das möglich sein, obwohl ich es nicht empfehlen kann.

Dann fällt mir noch die Firewall als Problem ein, wenn das WLAN von außen kommende Anfragen auf Webserver verbietet bekommt das Script die DAten nicht.

Vielleicht gibt es Logeinträge dazu, entweder im normale, im warning oder im Errorlog. Oder Du stellst mal auf debuggen, dann kommt sicher irgendwas irgendwo. Die könntest Du dann mal posten.

Oder Du bindest das per JavaScript ein, dann ist es topaktuell und außerdem greifst sowieso nur du auf die Überwachungskameras zu. Das muss Dein WLAN, ... aushalten.

AnonymusChaotic · 13. Dezember 2015

Ich bin gerade dabei, eine Seite zu bauen, die im Aufbau ähnlich der Seite https://developers.google.com/…atterns/tiny-tweaks?hl=en ist.

Dabei habe ich jetzt mal folgenden Code geschrieben:

HTML

<!DOCTYPE html>
<html lang="de">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="style/style.css" type="text/css" rel="stylesheet" />
		<link rel="icon" href="/sys_img/favicon.ico">
		<title>MinecraftServerAdmin.net</title>

	</head>	
	<body>
	<script type="text/javascript"> 
		<nav class="" id="">
		<div class="" id="bigcontentarea">
				<header class="tabellen_zelle" id="">
						<h1>   
						<a class="menue-button menue-button-beschr-close" href="#nav-menue-zu">MENÜ zu</a>
						<a class="menue-button menue-button-beschr-open" href="#nav-menue">MENÜ auf</a>
						Minecraftadmin.net </h1>
				</header>




				<article class="tabellen_zelle maximale_hoehe" id="article">
					<h1>Lorem ipsum dolor sit amet,</h1>
					<p>consecteteur. Gravida, donec nam facilisi convallis. Morbi ornare. Dis fusce aliquam ultricies, duis nec. Mi rutrum et, eleifend posuere elit enim faucibus torquent. Nascetur urna et ipsum interdum et, vitae malesuada. Netus donec nostra ve sociis primis, fringilla aliquet ornare non in montes. Porttitor cras sem sociosqu vitae eros aliquam cras, porttitor eu malesuada. Bibendum, nibh mollis hymenaeos justo consequat faucibus volutpat ipsum. Sem.</p>
					<p>Ac morbi in nibh, class, dignissim. Rutrum duis per cras sit neque gravida platea, elit enim rutrum quisque orci. Per in class ve. Neque vestibulum nisi nulla. Nunc. Feugiat vel. Massa, pede ac consectetuer congue curae parturient. Ante elit dapibus magna est posuere ve. Malesuada pellentesque nonummy curabitur duis mus augue cubilia. Imperdiet lorem tristique nisi gravida mi, congue. Condimentum per, at. Egestas accumsan morbi feugiat in consequat ullamcorper, fringilla enim quisque et fermentum. Quisque.</p>
					<p>Semper cursus pharetra est viverra metus id montes. Nec, justo habitasse vestibulum nunc purus congue congue proin nec erat ridiculus elit nullam massa ornare. Eros, non justo per dolor leo neque. Est enim non leo nam at facilisi lacinia. Aliquam. Nibh mus nisi adipiscing platea id interdum laoreet natoque rutrum est at. Sem. Gravida ridiculus non neque natoque accumsan risus urna lectus, euismod elementum sem vitae metus, sed. Aliquet in, ac dui fringilla. Ornare hendrerit dictumst. Quam nec class sociis vestibulum nulla. Euismod, cras semper varius bibendum. Mus, lacinia at, sed nunc parturient sem parturient parturient. Morbi varius duis, mauris id torquent feugiat felis magna dis molestie.</p>




				</article>




				<footer class="tabellen_zelle" id="">
					<ul>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>
						<li class="footer_list_element" id="footer_list_element1"><a>Lorem Ipsum</a></li>

					</ul>

				</footer>	
		</div>
	</body>













</html>

Alles anzeigen

und

CSS

*{
	margin: 0;
	padding: 0;
	font-family: Arial, sans-serif;
   box-sizing: border-box;
}




html, body {
	height: 100%;
}




body {
	display: table;
	width: 100%;
	background-color: gray;
}




nav {
	float: left;
	width: 200px;
	height: 100%;
	overflow-y: auto; /* scrollbarkeit */
	background-color: silver;

}
#bigcontentarea {
width: calc(100% - 200px);




	float: left;
	min-height: 100%;
}
header {
	padding: 1em;
	background-color: yellow;




}
#article {
	    background-color: orange;
}
footer {
		padding: 0.7em;
		background-color: pink;
}
.tabellen_zelle {
    display: table-row;




}




.maximale_hoehe {
    height: 100%;
    background-color: deepskyblue;
}










/*mobile Steuerung*/
.menue-button {
 	display: none;
}

Alles anzeigen

Jetzt soll der Footer wie im Sticky footer-tutorial http://www.html-seminar.de//re…bdesign-sticky-footer.htm unten kleben. Das will aber nicht so, wie ich das will. Also mit 100% höhe geht es nicht, aber mit 1000px höhe wird der Bereich 1000px hoch. warum? Was muss ich ändern, damit ein sticky footer auch in der Div funktioniert?

AnonymusChaotic · 12. Dezember 2015

Also Pprinzipiell ist Bootstrap eine Bibliothek, mit der man schneller Webseiten bauen kann. vereinfacht gesagt muss man nicht sagen: für eine Navigation mache buttopns und einen Rahmen und hover-effekte und, und, und, ... sondern man sagt NAVIGATION! und schon passt das.

zum Beispiel die Seite mcvienna.at ist in Bootstrap gebaut worden, wobei ich an der Vergabe der Farben ein wenig rumgepfuscht habe (nicht ganz professionell, aber es funktioniert). Da kannst Du mal einen kleinen Blick auf den Aufbau einer Bootstrapseite werfen.

wenn ich das richtig mitbekommen habe dann ist das bootstrap admin panel nur ein Admin-Panel-design, das du auf einem CMS (ContentManagementSystem, also ein (PHP)-Programm zur Verwaltung Deiner Webseite) einspielen kannst, damit das Adminpanel (das ja nur Du und eventuell andere Poster) aufrufen dürfen) hübscher wird.

Fazit: entweder Du installierst ein CMS (Joomla, Wordpress, typo3, drupal; CMS-Systeme können va. bei unsicherer Installation von Zombieservern oder Hackern angegriffen und dann für üble Dinge benutzt werden) oder machst alles direkt aus dem Code heraus. Dateien, die überall gleich sind, können per include-php-funktion in das htmldokument eingebunden werden, sodass man, wenn man beispielsweise etwa die Navigation ändern will nur eine datei und nicht alle ändern muss.

AnonymusChaotic · 11. Dezember 2015

prinzipiell ja, nur sind bei solchen Themes meiner Erfahrung nach immer unendlich viele CSS anweisungen.
Du solltest darauf achten, dass die Anweisung nicht irgend einer anderen im Dokument widerspricht (vermutlich ist irgendwo schon body {margin: 0; } Oder alternativ statt body auch * / body, html / html angegeben worden). Das macht zusätzliche Angaben unwirksam.

AnonymusChaotic · 11. Dezember 2015

Sicher JAVA und nicht JavaScript?

AnonymusChaotic · 6. Dezember 2015

Farbverläufe einzubauen ist eine Gute Idee Danke

Vielleicht könnte man das irgendwie umbauen, dass es so ähnlich gekrisselt aussieht wie die andere Webseite?
Ich durchblicke das System dieser Punkte nicht wirklich...
http://lea.verou.me/css3patterns/#starry-night

AnonymusChaotic · 6. Dezember 2015

Auf folgender Webseite (https://www.sebastian-kurz.at/de) gibt es einen Hintergrund, der nicht wie die normalen CSS-hintergründe Streifen hat sondern so krisselig erscheint.

Muss ich dazu ein Bild verwenden oder kann ich das auch irgendwie mit ein paar Zeilen CSS erledigen?
Wie das auf der Webseite gemacht wurder kann ich leider nicht sagen, durch die tausenden? Anweisungen finde ich nicht mehr hindurch

AnonymusChaotic · 6. Dezember 2015

Danke, hat funktioniert!

Habe das mal an der bugreport-meldemöglichkeit gelistet

AnonymusChaotic · 6. Dezember 2015

Im Tutorial für das responsive design hier hat die von mir erstellte Seite wie auch die Bespielseite in der Mobilansicht rechts oben ein kleines, grünes kästchen, das da m.E. nicht sein sollte.
Die Linie unten geht auch nicht bis ganz an den rand, ebenso der Hintergrund unter den ausklappbaren Balken.
[Blockierte Grafik: http://img5.fotos-hochladen.net/uploads/bildschirmfotor830bgkhnv.png]

Beispielseite: http://www.html-seminar.de/rwd…onsive-design-ohne-js.htm
Tutorial: http://www.html-seminar.de/toggle-menue-ohne-javascript.htm

Dadurch ist auch die Webseite breiter als 100% Wie mache ich das weg? Bzw. stelle das Richtig?

AnonymusChaotic · 22. Februar 2015

Danke mal für die Tipps, ich bin ein Stück weitergekommen

[Blockierte Grafik: http://img3.fotos-hochladen.net/uploads/webseite20gpdxwmu73.png]

Jetzt habe ich noch folgende Probleme:

1.) Der Header soll, wenn man die Browserseite kleiner macht mitschrumpfen, auch in der Höhe. Das funktioniert bereits, allerdings verschwindet die Schrift nach unten. Wie behebt man das?

2.) Schrumpft man die Browserseite (in der Breite) so weit zusammen, dass ein Button umbricht, geraten diese aus der Zentrierung. Ist es möglich, alle Buttons permanent zentriert zu halten?

Spoiler anzeigen

3.) Das mit dem Footer haut immer noch nicht hin. Folgendes ist gewünscht:

Spoiler anzeigen

//Edit: Wäre es nicht möglich, Spoiler zuzulassen? Würde das Ganze viel einfacher machen...

AnonymusChaotic · 20. Februar 2015

Wo würdest du link zum Impressum, Datenschutz Erklärung, disclaimer, ggf. Link zu den AGB/nutzungsbedingungnen, copyright, ... denn hintun?

AnonymusChaotic · 20. Februar 2015

Danke mal für die Hilfe, ich versuche das, am Nachmittag umzusetzen.

Was mir jetzt noch fehlt, ist wie ich den hässlichen border: 1px black solid-Bereich in diesen pergamentfarbigen Bereich unten als sticky footer bringe. Hab das mit sticky footer noch nie wirklich hinbekommen

AnonymusChaotic · 20. Februar 2015

Hallo,
ich bastle wieder mal an einer Webseite und komme nicht so recht weiter.

Rahmenbedingungen
HTML-Version: 5
zusätzliche Techniken: CSS 2 + 3
Einschränkungen: keine
Browser & Betriebssystem: Google chrome aktuell, windoofs 8
Editor: Scriptly

Problembeschreibung
Fehlermeldung/-beschreibung: //
bisherige Lösungsversuche: keinen Plan
Code: http://pastebin.com/4W7Kys9K
Link zum Bild: http://img3.fotos-hochladen.net/uploads/headerh9ulgoi60e.jpg

Die Webseite wird dann mit zusätzlicher CSS-Datei auch für mobilde Geräte adaptiert, wie hier beschrieben:
http://www.com-magazin.de/prax…s-css-fuer-mobile-browser

#########################################################################
[Blockierte Grafik: http://img3.fotos-hochladen.ne…ds/webseite7djb3nz9h2.png]

Die Buttons passen schon ;), ev. werde ich noch kleine Details verändern.

Das Blatt Papier darunter könnte etwas gemustert sein, sollte aber nicht zu lasten der Ladezeit gehen. Gibt es eine Möglichkeit, ohne Grafik?

Das bild über den Buttons sollte zentral sein und im Hintergrund einer Div liegen, damit ich noch was drüber legen kann.

Der hässliche Kasten am unteren Rand soll entweder am Ende der Webseite angezeigt werden oder am Ende des pergamentfarbenen Felds. Aus der Anleitung im Seminar werde ich nicht wirklich klug

Würde mich freuen, wenn sich jemand bereit erklärt, da drüberzuschauen und mir zu erklären, warum er was wie gemacht hat, ich möchte das schließlich nachher auch können

AnonymusChaotic · 16. Dezember 2014

Oh ja, gute idee. Werde ich mal probieren

Beiträge von AnonymusChaotic

Merkwürdiges Verhalten mit Umlauten im Browser

Welchen Editor nutzt Ihr?

Mobile Seite - Wiederholungen von function geht nicht!

html-Sticky-Footer will nicht so recht

timestamp in html-Formular

html-Sticky-Footer will nicht so recht

DIV Element ändern via PHP/JAVA von anderem apache

html-Sticky-Footer will nicht so recht

Bootstrap Admin Panel ?

Entfernung oberer Rand

Java Datepicker aus Input Type Element in PHP Variable schreiben und weiterverarbeiten

Hintergrund krisselig ohne Bild

Hintergrund krisselig ohne Bild

Responsive Design Tutorial fehler/BUG?!

Responsive Design Tutorial fehler/BUG?!

Hilfe bei Umsetzung von Websitedesign

Hilfe bei Umsetzung von Websitedesign

Hilfe bei Umsetzung von Websitedesign

Hilfe bei Umsetzung von Websitedesign

Deckel, Boden und variabler Mittelteil