Problem mit CSS Datei

Jump to last post
T

Thomas

Neu angemeldet
Registriert
26 Juli 2013
Beiträge
269
Ich habe ein kleines Problem. Ich möchte Div Container erstellen und nutze dazu css. Ich habe im Grunde alles fertig, die CSS Datei ist korrekt, außerdem habe ich funktionierende Dateien aus dem Netz getestet. Auch habe ich es korrekt definiert. Wenn ich nun die css.Datei mit dem HTML Editor (Phase 5) starte, dann kommt genau der Text, der in der css.Datei steht, in einem Textdokument, es funktioniert also nicht. Weiß jemand, warum??
 
Ein Browser interpretiert HTML-Dokumente, in denen sich HTML-Code befindet. Um die Darstellung des Dokuments anzupassen, verwendet man CSS, welches häufig in .css-Dateien ausgelagert wird. Dementsprechend kannst Du einen div-Container nur mithilfe von HTML erzeugen.

Es scheint, als wirfst Du ein paar Begriffe durcheinander.

Könntest Du Deine Dateien einmal irgendwo hochladen, sodass man sich das Problem besser vergegenwärtigen könnte?
 
  • Thread Starter Thread Starter
  • #3
Da der Quellcode leider personenbezogen ist und zudem nicht einmal meine Angelegenheiten (ein Kumpel von mir möchte eine Seite), kann ich das leider nicht tun - sorry!!

Ja, der Quelltext ist fertig. Ich habe in der index Datei z.B. stehen

<div id="Fenster">
</div>
Zum Vergrößern anklicken....

In der CSS Datei steht

#fenster {

width:500px;
height:200px;

}

Das im Index steht im Body natürlich.
Zum Vergrößern anklicken....
 
Das Stylesheet ist korrekt (die Angabe fixer Dimensionen in Pixel allerdings nur in den seltensten Fällen sinnvoll - siehe auch
You do not have permission to view link please Anmelden or Registrieren
). Wenn du die CSS-Datei über ein entsprechendes link-Element wie z.B.
HTML:
Expand Collapse Copy 
<link rel="stylesheet" type="text/css" href="foobar.css" />
im head-Element deines Dokuments lädst, müsste es die erwartet Wirkung haben - allerdings nur im Browser, nicht in einem Text-Editor und möglicherweise auch nicht in einem WYSIWYG-Editor. Funktioniert das nicht, stelle sicher, dass Dateiname und Pfas korrekt sind, im Zweifelsfall über einen Web-Debugger wie Firefox, Opera Dragonfly oder die WebKit-Entwicklertools in Chrome/Chromium.
 
  • Thread Starter Thread Starter
  • #5
@Kugelfisch

Ja, das war nur zum Testen, da ich es im NEtz so in einem Tutorial gesehen habe und es funktioniert. Um zu testen müssen ja die selben Bedingungen herrschen.

<link rel="stylesheet" type="text/css" href="foobar.css" />
Zum Vergrößern anklicken....

EXAKT so habe ich es, das ist ja, was ich nicht verstehe.

allerdings nur im Browser
Zum Vergrößern anklicken....

Wie meinst du das, im Browser? Also ist ja logisch. Der HTML Editor nutzt standardmäßig den IE (kann auch modifiziert werden, klar).

Dateiname und Pfade stimmen auch - zumindest erkenne ich keinen Fehler. Ich werde nochmals schauen, ggf. mit einem Debugger.

Vielen Dank schon mal!
 
Beachte auch, dass Du Fenster einmal mit großen F und einmal mit kleinem f geschrieben hast.
 
Thomas schrieb:
Wie meinst du das, im Browser? Also ist ja logisch. Der HTML Editor nutzt standardmäßig den IE (kann auch modifiziert werden, klar).
Zum Vergrößern anklicken....
Phase 5 ist primär ein auf HTML spezialisierter Texteditor, zur Vorschau kommt ein beliebiger Browser zum Einsatz. Beachte, dass du dir im Browser (bzw. über die Vorschau-Funktion) nicht die CSS-Datei selbst, sondern das HTML-Dokument, in dem sie per link-Element eingebunden ist, anzeigen lassen musst.


epiphora, stimmt, das hatte ich übersehen. Allerdings erklärt das nicht das beschriebene Fehlerbild, dass im HTML-Dokument(?) das Stylesheet als Text ausgegeben wird.
 
  • Thread Starter Thread Starter
  • #8
Ich habe nun noch einmal komplett neu einen Test begonnen, d.h., in einem neuen Ordern, und nur zwei Dateien, index.html und style.css - immer der selbe Fehler.

Der Code sieht folgendermaßen aus:

[src=html4strict]<html>
<head>
<title>Div-Container</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>

<body>


<div id="fenster">

</div>
</body>
</html>[/src]



[src=css]#fenster {
width:900px;
height:500px;
background:black;
}[/src]


Obiger Code wird in einem Textdokumnet ausgegeben...

Edit: Ich denke, ich habe den Fehler gefunden, bin mir aber nicht ganz sicher, an was es genau lag. Entweder lag es am installierten "UltraEdit", mit dem man extrem große Textdateien einlesen kann (Passwortlisten für Brute Force Angriffe) oder daran, dass ich die Vorschau immer gestartet habe, als ich nicht auf der HTML Datei war, sondern der CSS Datei. Bei der CSS Datei kommt immer noch der beschrieben Fehler. Allerdings hatte ich vorher die HTML Datei im Browser schauen wollen, dort kam einfach ein weißes Fenster-. Es müsste also tatsächlich am "UltraEdit" liegen, der - soviel zum Verständnis", ebenfalls mit CSS und ähnlichen Dateielementen umgehen kann.

VIELEN DANK AN ALLE!!!!
 
Zuletzt bearbeitet:
also wenn ich das alles c&p, oberen teil in eine html datei klatsche und unteren teil in "style.css", dann habe ich, wenn ich die html datei öffne (mit dem browser!), ein großen schwarzen kasten auf weißem hintergrund.
quasi genau das, was du oben vorgegeben hast.
 
  • Thread Starter Thread Starter
  • #10
Ja, danke, es geht nun. Ich habe aber noch eine Frage., Der Quelltext ist fertig, ich möchte nun nachträglich Div Container verwenden. Das geht ja, wenn ich ebenfalsl eine CSS Datei erstelle und entsprechnde Eintragungen mache und den Link in die Index.HTML einfüge, oder?

Eine Frage, ich möchte nicht, bzw. mein Kumpel möchte das nicht, dass es über die ganze Seite dargestellt wird, also dass die SEite zentreirt nur in der Mitte ist, sieht besser aus, oder? Wie mache ich das?
 
du kannst die komplette seite in einen div packen.
Code:
Expand Collapse Copy 
<div id="main">
kompletter seiteninhalt
</div>

Code:
Expand Collapse Copy 
#main {
width:1200px;
margin:0px auto;
}

edit:
alternativ

Code:
Expand Collapse Copy 
#main {
width:1000px;
margin-left: -500px;
position: absolute;
left: 50%;
}

wobei "margin-left: -ZAHLpx;" immer die hälfte von "width" sein muss.
das obere könnte evtl in einigen browsern nicht funktioneren.
 
Zuletzt bearbeitet:
  • Thread Starter Thread Starter
  • #12
Ja, aber es sind mehrere Seiten. Also z.b. "Bilder", "Gästebuch" usw. Dort wird ja dann immer verlinkt.
 
Du kannst die Eigenschaften auch direkt für das body-Element setzen, wodurch keinerlei Anpassungen am Markup erforderlich sind:
[src=css]body {
width: 420px;
margin: 0 auto;
}[/src]

Abul schrieb:
das obere könnte evtl in einigen browsern nicht funktioneren.
Zum Vergrößern anklicken....
Da wären zumindest mir in verbreiteten Browser (selbst im IE bis Version 6) keine Probleme bekannt. Das Verhalten bei horizontalen auto-margin-Werten ist in CSS 2.1 eindeutig spezifiziert und wird in allen mir bekannten Browsern auch korrekt implementiert. Der Ansatz der absoluten Positionierung hat hingegen entscheidende Nachteile, insbesondere werden auf Viewports, welche schmaler als die angegebene Breite sind, Informationen unzugänglich.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben