Beiträge von sejuma

sejuma

Kannst du mal bitte einen Link zur Seite posten?

sejuma

Eine Grafik hat nun mal eine bestimmte Breite und Höhe und Hintergrundgrafiken sind da grundsätzlich nicht flexibel.
Du könntest jedoch eine Grafik wählen, welche (vermeintlich) groß genug ist, um auch bei großen Viewports noch vollständig angezeigt zu werden.
Oder du wählst die Grafik so geschickt, dass sich ein Teil davon kachelen (wiederholen) kann.
Lösungsansätze hierzu:
http://www.ohne-css.gehts-gar.net/0030.php
http://www.ohne-css.gehts-gar.net/0029.php

Alternativ könntest du ein Layout mit fixen Breiten wählen, passend zu den Maßen der Hintergrundgrafik.
Was die Länge betrifft, kannst du zusätzlich einen Farbton als Hintergrundfarbe hinterlegen. Dieser kommt dann zum tragen, wenn der Inhalt länger wird als die Grafik hoch ist.
http://www.ohne-css.gehts-gar.net/0027.php

Unabhängig davon noch ein Tipp zu deinem Code:
Nach dem geschlossenen </head> musst du zunächst den <body> öffnen.

Diese Angaben bei #bg und #content sind unnötig und sollten gelöscht werden:

Code

position: absolute;
left: 0px;
top: 0px;

sejuma

Ich kann's mir jetzt leider nicht ansehen, wie's im FF aussieht.
Im IE 7 sollte es aber hinkommen:

Verwende bei den Absätzen statt

Code

<p class="left">

lediglich

Code

<p>

Davon unabhängig halte ich statt p einen div für sinnvoller. Denn der darin befindliche Text sollte ja wieder ´wohl aus mehreren Absätzen bestehen.

Das Bild oben rechts binde so ein:

Code

<img style="float: right;" src="Bilder/index-bild.jpg" alt="" />

sejuma

Sieht aus, als würde der Platz nicht ausreichen:

#rightbox ist 700px breit.

p #rightbox 500px + 2 x 15px margin = 530px

.rfloat: 200px + 2 x 15px margin = 230px

macht zusammen 760px.

Setze mal p #rightbox auf 440px.

sejuma

@Unregistriert:
Schicke deinen Lehrer mal hier ins Forum.
Wir werden ihm etwas "Nachhilfe" geben.

Das nützt dir jetzt leider persönlich nichts.
Eine sehr ausführliche Anleitung zu Frames findest du hier ff: http://www.friedels-home.de/index.html?/Ku…ML/27frames.htm

sejuma

Bevor du jetzt anfängst Frames zu lernen: Spar dir diese Übung.
Frames sind absolut nicht mehr zeitgemäß, haben etliche Nachteile im Hinblick auf Suchmaschiunen und Bookmarks.
Investiere die Zeit besser für eine Seite mit CSS und ohne Frames.
http://www.ohne-css.gehts-gar.net/0033.php

sejuma

Gib dem img-style noch einen margin-left-Wert. Siehe http://www.ohne-css.gehts-gar.net/0019.php

sejuma

Versuch's mal so:

Code

#content
{
 height:180px;
 background:green;
width: auto;
 margin-top:5px;
 margin-bottom:5px;
 padding-left:5px;
 padding-right:5px; }


#info
{width:190px;
 height:180px;
 background:red;
float: right;
 margin-top:5px;
 margin-bottom:5px;
 padding-left:5px;
 padding-right:5px; }

Alles anzeigen

Code

<div id="wrapper">
<div id="info">info</div>
<div id="content">content</div>
</div>

sejuma

Wieso zweckentfremden?
Das title-Attribut ist grundsätzlich für alle Elemente erlaubt: http://de.selfhtml.org/html/referenz/…versalattribute

sejuma

Das sieht nach einem Hack für den IE Explorer aus.
Soll heißen: Eine Sorte von Browsern verwendet 32px, die andere 24px.
Diese Deklarationen können nur bestimmte Browser lesen und nehmen somit auch einen abweichenden Wert.
Normalerweise sollte das jedoch nicht erforderlich sein. Eine Höhenangabe reicht aus.
Es kommt vielmehr darauf an, dass der IE das CSS-Boxmodell richtig interpretiert. Das erreichst du mit einem qualifizierten Doctype unter Angabe der DTD-URL. Dann sollten derartige Hacks eigentlich überflüssig sein, siehe http://www.ohne-css.gehts-gar.net/0006.php

Voice-family hat mit dieser Geschichte eigentlich gar nichts zu tun. Es wird lediglich dazu missbraucht, dass bestimmte Browser eine abweichende Höhenangabe verwenden.
http://www.css4you.de/voice-family.html

sejuma

Stelle die CSS-Reihenfolge um:

Code

.topmenue:link {color:#4a4a4a; text-decoration:none;}
.topmenue:visited {color:#4a4a4a; text-decoration:none;}
.topmenue:hover {color:#4a4a4a; text-decoration:underline;}

Siehe http://www.friedels-home.de/index.html?/Board/index.php unter "Wichtig"

sejuma

Definiere für h3 ebenfalls margin: 0

Code

h3 {
margin: 0;
padding: 0;
}

sejuma

Bisher:

Code

<h1 style="font-size:1200%; color:grey"><b><i>ZOMME</i></b></p></h1>

Besser:

Code

<h1 style="margin: 0; padding: 0; font-weight: bold; font-style: italic; font-size:1200%; color:gray">ZOMME</h1>

Noch besser:

In die CSS-Angaben füge hinzu:

Code

h1 {margin: 0; padding: 0; font-weight: bold; font-style: italic; font-size:1200%; color:gray;}

HTML:

Code

<h1>Zomme</h1>

sejuma

Für vertikalen Text gibt es m.W. keine CSS-Lösung.
Alternativen:

Vertikalen Text als Grafik abspeichern und einbinden.
Oder nach jedem Buchstaben einen Zeilenumburch, das ganze innerhalb eines schmalen Elements:

Code

T<br>
e<br>
x<br>
t

Nachteil beider Lösungen: Nicht für Suchmaschinen geeignet.

sejuma

Du könntest eine Sicherungskopie deiner index-Datei machen.
Dann verwendest du die Index-Datei für eine Mitteilung über den Wartungsmodus und lädst sie hoch.
Nach der Wartung wieder die Originaldatei mit dem "Normalinhalt" hochladen.

sejuma

Eine Fehlerquelle:
Weise #left und #rechts noch ein

Code

display: inline;

zu, siehe http://www.ohne-css.gehts-gar.net/0032.php

Bei #navibottom setze mal den ersten Wert auf "0" (kann ich jetzt aber nicht prüfen, weil ich keinen IE 6 mehr habe).

Code

margin: 15px auto 0 auto;

sejuma

http://www.css4you.de/Texteigenschaften/word-spacing.html

sejuma

Wie wär's damit?

Code

<hr style="color: #ccc; height: 1px; border: dotted;">

sejuma

Nein, der Tipp von bandit600 funktioniert leider nicht.
active beschreibt den Zustand des Links zu dem Zeitpunkt, wenn man mit der "Maus draufdrückt" und nicht, wenn die Seite geöffnet ist.
Wie das geht, findest du hier: http://www.ohne-css.gehts-gar.net/0016.php

sejuma

So macht man das auch nicht.
Die body-Angabe machst du nur einmal und schreibst alles rein, was einheitlich definiert sein soll und dazu gehört.

Die weiteren Inhalte schreibst du dann in angeordnete Div's.
In deinem Fall könntest du sogar gezielt h1 formatieren.

Versuch's mal so:

Code

body {
background-color: #FF0000;
background-image: url("fussball.jpg");
width: 1050px;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 50% 50%;
text-align: center;
}


#box1 {
margin: 50px 200px 30px 70px;
text-indent: 50px;
border: 1px solid black;
}

Alles anzeigen

Code

<body>
<div id="box1">
<h1>Auf dieser Datei werde ich verschiedene css codes ausprobieren die dann<br>für mein Browsergame benutzt werden sollen</h1>
</div>
</body>

Beiträge von sejuma

border-bottom

Hintergrundbild an Auflösung anpassen

Float im IE7

Float im IE7

Frames!!!!

Frames!!!!

Abstand vom Txt zum Bild

layout-frage

title-Attribut zweckentfremden bei Bildern, Links, etc.

Linkformatierung

Linkformatierung

Abstand zwischen zwei Überschriften

Abstand zwischen zwei Überschriften

Vertikaler Text

Homepage komplett sperren..Wartungsmodus

IE6 Abstände

Eingabefeld in Tabelle an Spaltengröße anpassen

border-bottom

Link Als Aktiviert kennzeichnen

Schrift geht über den rechten rand des bildes