nicht angemeldet
div-tag auf auf eine weite von 100% bringen
Hallo Forum!
Bisher habe ich nur mit Tabellenlayouts gearbeitet und somit noch sogut wie keine Erfahrungen mit mit div-tags und der Positionierung mit css.
Ich tüfftel nun schon länger mit den divs rum aber ich komme einfach nicht so recht klar und da ist nun das Problem:
Ich möchte ein ganz simple art kopfzeile über die gesamte Bildschirmlänge. Ich bekomme es jedoch einfach nicht hin - sie ist immer zu kurz. getestet nur unter xp mit internetexplorer 6 und opera 7.1 aber nicht mal das klappt es...
Der code ist aufs ässerste beschrenkt:
<html>
<head>
<title>Test Seite</title>
</head>
<body>
<div id="test" style="position:absolute;
width:100%;
background-color:DDDDDD;
top:0px;
left:0px;">Bla</div>
</body>
</html>
Ich hoffe jemand kann mir weiter helfen.
Gruß Alex
-
Hi,
Bisher habe ich nur mit Tabellenlayouts gearbeitet und somit noch sogut wie keine Erfahrungen mit mit div-tags und der Positionierung mit css.
<div>s sind _nicht_ der pauschale Ersatz von Tabellen. Nutze semantisches Markup, also beispielsweise <h1> für eine Überschrift ersten Grades, <ul> für unnummerierte Listen wie etwa die Navigation usw.
Ich möchte ein ganz simple art kopfzeile über die gesamte Bildschirmlänge.
Das ist unmöglich. Du hast lediglich das Browserinnenfenster zur Verfügung, nicht den ganzen Bildschirm.
Ich bekomme es jedoch einfach nicht hin - sie ist immer zu kurz.
Welche Abstände hat denn das umgebende Element?
Der code ist aufs ässerste beschrenkt:
Du solltest dennoch einen sinnvollen DOCTYPE angeben.
<div id="test" style="position:absolute;
Für Testzwecke ist das in Ordnung, aber letzten Endes solltest Du allen(!) CSS-Code unbedingt auslagern.
width:100%;
In 99% aller Fälle meint man mit width:100% eigentlich width:auto.
background-color:DDDDDD;
"DDDDDD" ist keiner der 17 definierten Farb-Keywords.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hi Cheatah,
vielen dank für die schnelle antwort!
meinst du mit -->
<div>s sind _nicht_ der pauschale Ersatz von Tabellen. Nutze semantisches Markup, also beispielsweise <h1> für eine Überschrift ersten Grades, <ul> für unnummerierte Listen wie etwa die Navigation usw.
das die divs nicht eine art gegenstück sind zu tabellenzellen(wenn man sie zum layout gestallten misbraucht)?
ich möchte oben eine div erstellen wo ich dann unter anderem eine überschrift (h1) und ein logo über die länge des gesamten Browserinnenfensters mit einer hintergrundfarbe erstelle.
dort bleibt jedoch immer der linke rand weis.
Du solltest dennoch einen sinnvollen DOCTYPE angeben.
so würde ich es auch nicht ins netz stellen.
"DDDDDD" ist keiner der 17 definierten Farb-Keywords.
ich bin wohl doch nur ein amateur ;-)
-
Hi Cheatah,
vielen dank für die schnelle antwort!
meinst du mit -->
<div>s sind _nicht_ der pauschale Ersatz von Tabellen. Nutze semantisches Markup, also beispielsweise <h1> für eine Überschrift ersten Grades, <ul> für unnummerierte Listen wie etwa die Navigation usw.
das die divs nicht eine art gegenstück sind zu tabellenzellen(wenn man sie zum layout gestallten misbraucht)?
ich möchte oben eine div erstellen wo ich dann unter anderem eine überschrift (h1) und ein logo über die länge des gesamten Browserinnenfensters mit einer hintergrundfarbe erstelle.
SORRY ES MUSS rechter rand heißen
dort bleibt jedoch immer der linke rand weis.
Du solltest dennoch einen sinnvollen DOCTYPE angeben.
so würde ich es auch nicht ins netz stellen."DDDDDD" ist keiner der 17 definierten Farb-Keywords.
ich bin wohl doch nur ein amateur ;-)-
Hi,
SORRY ES MUSS rechter rand heißen
dort bleibt jedoch immer der linke rand weis.
Kann es sein, daß Du den IE benutzt und der Platz rechts derjenige ist, der für den Scrollbalken reserviert ist?
Du solltest dennoch einen sinnvollen DOCTYPE angeben.
so würde ich es auch nicht ins netz stellen.Da der Doctype auch noch andere Auswirkungen hat (Darstellungsmodus), sollte er bei Beispielcode für Darstellungsprobleme NICHT fehlen.
cu,
Andreas--
MudGuard? Siehe http://www.Mud-Guard.de/
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.-
Hi Andreas,
SORRY ES MUSS rechter rand heißen
dort bleibt jedoch immer der linke rand weis.
Kann es sein, daß Du den IE benutzt und der Platz rechts derjenige ist, der für den Scrollbalken reserviert ist?
genau so was in die richtung hab ich auch gedacht und ewig dran rum gespielt bis it cheatah mich dann aufklärte das es der abstand vom übergeordneten tag ist den ich dann auf 0 gesetzt habe. dann hat alles gepasst.
Du solltest dennoch einen sinnvollen DOCTYPE angeben.
so würde ich es auch nicht ins netz stellen.Da der Doctype auch noch andere Auswirkungen hat (Darstellungsmodus), sollte er bei Beispielcode für Darstellungsprobleme NICHT fehlen.
dies ist mir jetzt abgesehen vom pocket pc nocht nicht arg aufgefallen (obwohl ich ihn natürlich bevor ich die seite ins netzstelle einfüge)
-
Hi,
Da der Doctype auch noch andere Auswirkungen hat (Darstellungsmodus),
dies ist mir jetzt abgesehen vom pocket pc nocht nicht arg aufgefallenRespekt für Deine Testumgebung :-) Das Stichwort für die Bedeutung des DOCTYPE lautet "Quirksmode". Suche danach im Archiv, bei Google, bei .org ;-) und bei den einschlägigen Browser-Herstellern.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes
-
-
-
-
Hi,
meinst du mit -->
[...]
das die divs nicht eine art gegenstück sind zu tabellenzellen(wenn man sie zum layout gestallten misbraucht)?
ja. Es ist ein absolut typischer, aber falscher Schritt auf dem Weg "weg vom Tabellenlayout", quasi jedes HTML-Element einfach durch <div> zu ersetzen (und am besten noch jeweils eine Klasse hinzuzufügen). Bei Verwendung von semantischem Markup mit CSS beginnt man (idealerweise, in der Praxis macht man natürlich hin und wieder Abstriche) grob gesagt mit einigen <div>s, welche gewöhnlich mit sprechenden IDs versehen sind ("navigation", "content", "header" usw.) _und fügt nie wieder ein <div> hinzu_. Der Rest sind <hX>, <p>, <ul>/<ol>/<dl>, <a>, <strong> usw., also Elemente, die aus HTML-Sicht eine Aussage haben.
dort bleibt jedoch immer der linke rand weis.
Wie gesagt: Das dem <div> strukturell übergeordnete Element hat noch Abstände.
"DDDDDD" ist keiner der 17 definierten Farb-Keywords.
ich bin wohl doch nur ein amateur ;-)Nein, ein Tippfehlermacher ;-)
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Juhuuu Vielen Dank Cheatah!
Es geht. musste nur beim body noch die abstände auf 0 setzen.ja. Es ist ein absolut typischer, aber falscher Schritt auf dem Weg "weg vom Tabellenlayout", quasi jedes HTML-Element einfach durch <div> zu ersetzen (und am besten noch jeweils eine Klasse hinzuzufügen). Bei Verwendung von semantischem Markup mit CSS beginnt man (idealerweise, in der Praxis macht man natürlich hin und wieder Abstriche) grob gesagt mit einigen <div>s, welche gewöhnlich mit sprechenden IDs versehen sind ("navigation", "content", "header" usw.) _und fügt nie wieder ein <div> hinzu_. Der Rest sind <hX>, <p>, <ul>/<ol>/<dl>, <a>, <strong> usw., also Elemente, die aus HTML-Sicht eine Aussage haben.
ahh sagen wir also 3-4 divs die die grundsätzliche struktur festlegen und die gesamt formatierung und position in eine cssdatei packen und den eigentlichen inhalt in die divs.
ich hab mich schon immer gewundert wie man mit so wenig so gute seiten machen kann...
Nein, ein Tippfehlermacher ;-)
ups - da hab ich was vergessen. dann werd ich ja vielleicht dochnoch profi haha
-
Hi,
ahh sagen wir also 3-4 divs die die grundsätzliche struktur festlegen und die gesamt formatierung und position in eine cssdatei packen und den eigentlichen inhalt in die divs.
exakt!
ich hab mich schon immer gewundert wie man mit so wenig so gute seiten machen kann...
Das erstaunt jeden - bis er's das erste Mal selbst gemacht hat. Dann erfreut es nur noch, aber immer wieder :-)
dann werd ich ja vielleicht dochnoch profi haha
Na, werd erst mal Experte oder Fachmann oder so (welcher Begriff Dir auch immer am ehesten zusagt), beruflich machen kannst Du es dann immer noch ;-)
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes
-
-
-
-