Seite 1 von 3

HTML/CSS Formatierung (span/div)

Verfasst: So Jun 06, 2010 12:50 pm
von HerrKlinke
Hi Leute,
ich war jetzt schon laaange nich mehr hier. Erstmal ein dickes Kompliment an den Andmin für das neue Disign und eins an die Community, die, die Inhalte mit gestaltet hat.

Ich bin gerade am CSS lernen und habe schon gleich ein Problem... vielleicht wisst Ihr ja weiter.

Also es geht um folgendes Menü:
http://denkerbude.de/testx.htm

Das eigentlich so aussehen sollte:
http://denkerbude.de/?location=home


Das 1. ist nur mit <span> gemacht, während das 2. ausschließlich durch eine unsichtbare Tabelle formatiert wird. Die Spans bei dem 2. sind nur zum Sichtbar/Unsichtbar machen.

So das Problem beim 1.:
Alle Hauptschaltflächen sollen in einer Reihe sein.
Wenn jetzt ein Untermenü aufgeht, sollen immer noch alle in einer Reihe sein.
Und was ich überhaupt nicht verstehe, ist: warum geht beim untermenü von "about" das von "projects" ebenfalls auf?!?!
- spätestens hier angelangt vertehe ich gar nichts mehr...
Hier der Quellcode der 1. Seite (nur body):

Code: Alles auswählen

			<!-- Schaltfläche Home -->
			
			<span id="s_home" style="display:inline-block">
			<a href="/?location=home">
			<img name="home" border="0" src="gfx/navi/home_active.gif" width="63" height="29"
			onmouseout="home.src='gfx/navi/home_active.gif'" onmouseover="home.src='gfx/navi/home_hover.gif'" align="left"></a><div id="s_projects" style="block"  onmouseover="menup.style.display='block'" onmouseout="menup.style.display='none'">
			</span>

		
			<!-- Schaltfläche Projects -->
			
			<span id="s_projects" style="display:inline-block" onmouseover="menup.style.display='block'" onmouseout="menup.style.display='none'">
			<img name="projects" border="0" src="gfx/navi/projects_normal.gif" width="85" height="29" onmouseout="projects.src='gfx/navi/projects_normal.gif'" onmouseover="projects.src='gfx/navi/projects_hover.gif'">

				<span id="menup" style="display:none;margin-top:0px" onmouseout="menup.style.display='none'">
					<img name="p_led"   border="0" src="gfx/navi/p_led_normal.gif"   width="85" height="21" onmouseover="p_led.src='gfx/navi/p_led_hover.gif'"     onmouseout="p_led.src='gfx/navi/p_led_normal.gif'">
					<br><img name="p_fotos" border="0" src="gfx/navi/p_fotos_normal.gif" width="85" height="21" onmouseover="p_fotos.src='gfx/navi/p_fotos_hover.gif'" onmouseout="p_fotos.src='gfx/navi/p_fotos_normal.gif'">
				</span>			
			</span>
			

			<!-- Schaltfläche "About" -->
			
			<span id="s_about" style="display:inline-block" onmouseover="menua.style.display='block'" onmouseout="menua.style.display='none'">
			<img name="about" border="0" src="gfx/navi/about_normal.gif" width="63" height="29" onmouseover="about.src='gfx/navi/about_hover.gif'" onmouseout="about.src='gfx/navi/about_normal.gif'">
				<span id="menua" style="display:none" onmouseout="menua.style.display='none'">
					<img name="a_feedback" border="0" src="gfx/navi/a_feedback_normal.gif" width="63" height="21" onmouseover="a_feedback.src='gfx/navi/a_feedback_hover.gif'" onmouseout="a_feedback.src='gfx/navi/a_feedback_normal.gif'">
					<br><img name="a_about"    border="0" src="gfx/navi/a_about_normal.gif"    width="63" height="21" onmouseover="a_about.src='gfx/navi/a_about_hover.gif'"       onmouseout="a_about.src='gfx/navi/a_about_normal.gif'">
				</span>
			</span>
		
			
			<!-- Schaltfläche Gästebuch -->
			
			<span id="s_guest" style="display:inline-block">
			<a href="/?location=home">		
			<img name="guestbook" border="0" src="gfx/navi/guestbook_normal.gif" width="106" height="29" 
			onmouseout="guestbook.src='gfx/navi/guestbook_normal.gif'" onmouseover="guestbook.src='gfx/navi/guestbook_hover.gif'" align="left"></a>
			</span>
Sorry, das mit der Formatierung hab ich nicht besser hinbekommen...

Hier ne kleine Skizze:
Bild

Ich brauche nur ein allgemeines Beispiel, wie ich soetwas realisieren kann. Es muss nicht unbedingt an meinem Quellcode gezeigt werden^^

Seht Ihr da durch? ;)

Re: HTML/CSS Formatierung (span/div)

Verfasst: So Jun 06, 2010 6:37 pm
von Dominik
WOW mal wieder was in Webtechnik sensationell ^^

Deine Seite ist einfach nur Chaos, CSS wird ausgelagert, Menüs macht man normalerweise nicht mit Spans

Ansonsten hast du einen Container (div) geöffnet und nirgents geschlossen


mfg

Re: HTML/CSS Formatierung (span/div)

Verfasst: Mo Jun 07, 2010 1:15 pm
von Xin
HerrKlinke hat geschrieben:ich war jetzt schon laaange nich mehr hier. Erstmal ein dickes Kompliment an den Andmin für das neue Disign und eins an die Community, die, die Inhalte mit gestaltet hat.
Und wo warst Du so lange? Der Admin arbeitet schon am nächsten Design, das vorhandene ist ja nur eine Übergangslösung - nur hält bekanntlich nichts so lange wie ein Provisorium.
HerrKlinke hat geschrieben:Das 1. ist nur mit <span> gemacht, während das 2. ausschließlich durch eine unsichtbare Tabelle formatiert wird. Die Spans bei dem 2. sind nur zum Sichtbar/Unsichtbar machen.
So das Problem beim 1.:
Alle Hauptschaltflächen sollen in einer Reihe sein.
Wenn jetzt ein Untermenü aufgeht, sollen immer noch alle in einer Reihe sein.
Und was ich überhaupt nicht verstehe, ist: warum geht beim untermenü von "about" das von "projects" ebenfalls auf?!?!
- spätestens hier angelangt vertehe ich gar nichts mehr...
Bevor ich jetzt Fehler suche, frage ich vorsichtshalber mal nach: Das ist schon alles korrigiert? Weil bei mir sieht das soweit gut aus!?


Dominik hat geschrieben:
HerrKlinke hat geschrieben:Ich bin gerade am CSS lernen und habe schon gleich ein Problem...
Deine Seite ist einfach nur Chaos, CSS wird ausgelagert, Menüs macht man normalerweise nicht mit Spans
Hat er doch selbst geschrieben geschrieben ^^

Re: HTML/CSS Formatierung (span/div)

Verfasst: Mo Jun 07, 2010 1:25 pm
von HerrKlinke
@Dominik
Ja, also jetzt wo du es sagst ;D
Ich hab versucht mit Javascript und rumflickelei meine sperrlichen CSS Kenntnisse auszugleichen...

@Xin
Ich bin nicht sicher, wie lange ich nicht mehr hier war.. vielleicht 6 Monate :shock:
Also die "testx" Seite ist noch nicht korrigiert. Aber freut mich, dass mein Versuch anscheinend auch von irgendwelchen Browsern richtig angezeigt wird :D .


Mitlererweile hab ich auch mitbekommen, dass man sowas mit <ul> und <li> macht.
Ich werde wohl lieber ein bloßes Javascript-Menü machen, als das ich jetzt nur deswegen noch CSS lerne....
Also ich hab ja jetzt damit angefangen CSS zu lernern, aber ich mein, man muss ja nicht alles können^^
Java, C, PHP - Das reicht. 8-)

Re: HTML/CSS Formatierung (span/div)

Verfasst: Mo Jun 07, 2010 1:35 pm
von Xin
HerrKlinke hat geschrieben:@Xin
Ich bin nicht sicher, wie lange ich nicht mehr hier war.. vielleicht 6 Monate :shock:
Also die "testx" Seite ist noch nicht korrigiert. Aber freut mich, dass mein Versuch anscheinend auch von irgendwelchen Browsern richtig angezeigt wird :D .
Ich bekomme bei der testx einen Eintrag angezeigt, der aufleuchtet, wenn man drüber fährt.
Mehr nicht... reicht das?

Ansonsten - welchen Browser benutzt Du?
HerrKlinke hat geschrieben: Mitlererweile hab ich auch mitbekommen, dass man sowas mit <ul> und <li> macht.
Ich werde wohl lieber ein bloßes Javascript-Menü machen, als das ich jetzt nur deswegen noch CSS lerne....
Also ich hab ja jetzt damit angefangen CSS zu lernern, aber ich mein, man muss ja nicht alles können^^
Java, C, PHP - Das reicht. 8-)
Es ist immer die Frage, wie Du die ul und li, bzw. spans klassifizierst und beschreibst.
Ich weiß ja nicht, wohin Du Dich orientierst, aber spannend wird die Sache erst mit C++.

Die Website an sich gefällt mir übrigens gut.

Re: HTML/CSS Formatierung (span/div)

Verfasst: Mo Jun 07, 2010 1:58 pm
von HerrKlinke
Nein, das was du siehst reicht nicht... da ist eigentlich das gesamte Menü zu sehen^^

Naja also ich hatte mal kurz C++ gelernt. Und dann aber richtig C.
Also in C++ gibt es Unions... und in C nicht... Mehr wüsste ich jetzt nicht, wo da der unterschied ist.
Also wie du siehst, habe ich es wirklich nur mal "kurz" gelernt.

Ansonsten bin ich recht gut mit C vertraut. Nicht experte, aber doch schon sehr vertieft.
Also ich bin darauf aus, sehr Maschinennahe und relativ 'abstrakt' zu programmieren. Java ist mir z.B viel zu simpel und 'Menschennahe' ;)

Es gehört hier eigentlich nicht in diesen Thread, aber wo wir gerade dabei sind: Kannst du mir in 2 Sätzen den Unterschied/die Vorzüge von C++ gegenüber zu C sagen?

Aaaahhh!!! Jetzt fällt es mir ein: Klassen und Vererbung??? Richtig?
PS: Browser ist Firefox 3.6.3; Danke für das Lob. Ich hatte mir auch viel Mühe mit dem Design gegeben.

Re: HTML/CSS Formatierung (span/div)

Verfasst: Mo Jun 07, 2010 2:21 pm
von Xin
HerrKlinke hat geschrieben:Nein, das was du siehst reicht nicht... da ist eigentlich das gesamte Menü zu sehen^^

Naja also ich hatte mal kurz C++ gelernt. Und dann aber richtig C.
Also in C++ gibt es Unions... und in C nicht... Mehr wüsste ich jetzt nicht, wo da der unterschied ist.
Unions gibt's auch in C.
HerrKlinke hat geschrieben:Ansonsten bin ich recht gut mit C vertraut. Nicht experte, aber doch schon sehr vertieft.
Unions? ;-)
HerrKlinke hat geschrieben:Also ich bin darauf aus, sehr Maschinennahe und relativ 'abstrakt' zu programmieren. Java ist mir z.B viel zu simpel und 'Menschennahe' ;)
Vorrangig musst Du richtig programmieren.
HerrKlinke hat geschrieben:Es gehört hier eigentlich nicht in diesen Thread, aber wo wir gerade dabei sind: Kannst du mir in 2 Sätzen den Unterschied/die Vorzüge von C++ gegenüber zu C sagen?
Aaaahhh!!! Jetzt fällt es mir ein: Klassen und Vererbung??? Richtig?
C ist vollständig in C++ enthalten. Zusätzlich zu Klassen, Vererbung und virtuelle wie abstrakte Methoden - was Du alles in C auch abbilden könntest, wenn Du wüsstest, wie - gibt es noch Templates und Const-Correctness.
HerrKlinke hat geschrieben:PS: Browser ist Firefox 3.6.3; Danke für das Lob. Ich hatte mir auch viel Mühe mit dem Design gegeben.
Ich schau gleich nochmal, ich muss heute eh nochmal ans Webdesign.

Re: HTML/CSS Formatierung (span/div)

Verfasst: Mo Jun 07, 2010 3:27 pm
von Dominik
Na sicher du kannst PHP aber kein CSS, ich würde sagen wer kein CSS kann kan auch nicht wirklich PHP das gehört einfach zusammen beim Websiten bau, da will ich dann nicht deine PHP Scripts sehen


Der Fehler lag an deinem nicht geschloßenen Div aber naja


mfg

Re: HTML/CSS Formatierung (span/div)

Verfasst: Mo Jun 07, 2010 3:57 pm
von Dirty Oerti
Dominik hat geschrieben:Na sicher du kannst PHP aber kein CSS, ich würde sagen wer kein CSS kann kan auch nicht wirklich PHP das gehört einfach zusammen beim Websiten bau, da will ich dann nicht deine PHP Scripts sehen
Würde ich so nicht sagen. PHP kann auch zu anderen Dingen als Webseiten basteln verwendet werden.
Oder besser gesagt: Nicht alles, was von PHP gemacht wird, sieht man auch (und muss dementsprechend mit CSS in eine schöne Form gebracht werden)
Dominik hat geschrieben:Der Fehler lag an deinem nicht geschloßenen Div aber naja
Ist das Problem denn nun behoben?

Re: HTML/CSS Formatierung (span/div)

Verfasst: Mo Jun 07, 2010 4:31 pm
von Dominik
Das weis ich schon, aber so ist es halt mal üblich denn gerade im "Webaplicationbau" liegen die Vorteile von PHP
Klar kann er Scripte ohne Ausgabe gemacht haben aber an Ausgaben kommt er da nicht rum und die kommen bald vorallem wenn man PHP lernt, bzw baut man zuerst etwas mit Ausgabe und benötigt dann vllt Scripte die keine Ausgabe haben;)

Ja es ist behoben zumindest ging es bei mir wie ich die Div reingeschrieben habe

mfg