eigentlich wundert mich, dass der firefox es 'korrekt' anzeigt, was den elementfluß angeht.

'float' heisst 'fluß', d.h. damit bestimmtst du, wie sich die elemente umfließen.
zur verdeutlichung: wenn ein eingebundenes bild die eigenschaft "float: left" hat, dan wird der text rechts daneben stehen bis keiner mehr hinpasst. sobald kein platz mehr übrig ist, gehts dadrunter weiter. so geht das auch mit anderen elementen. da dein content-teil aber 800pixel breit ist, ist es doch klar, dass er nicht mehr rechts neben das menu passt.

bei dem menu ist der fehler auch ziemlich deutlich: die div box 'menu' ist vollkommen leer, daher wird sie mit ner höhe von 0 px gerendert. bei meinem code hat es einen sinn, dass die einzelnen boxen ineinander geschachtelt sind. zum thema "height: 100%": eine %-angabe is "je nach CSS-Eigenschaft relativ zur elementeigenen Größe, oder zu der des Elternelements, oder zu einem allgemeineren Kontext." (zitat selfthtml). soll heißen, dass man das nicht immer genau bestimmen kann. d.h. bei width für relative designs ganz brauchbar aber bei height fast immer ziemlich unberechenbar. (afaik).
wie auch immer. schachtel die boxen (dafür sind sie da) und es wird funktionieren.

was den überstehenden weissen pixel angeht hilft auf jeden fall firebug, um rauszufinden, welches element genau da jetzt zu breit oder zu schmal ist. die 'farbiger rand' methode würde hier versagen, da es ja nur um einen pixel geht.

ganz allgemein: benutz mehr selfhtml, deinen verstand (nachdenken / brüten) hilft und den firebug. ausprobieren hilft auch oft.
und styleangaben direkt in elementen ist häßlich. dafür ist schließlich die css datei da.

"Herr Keuner sagte: «Schwierig ist, diejenigen zu belehren, auf die man zornig ist. Es ist aber besonders nötig, denn sie brauchen es besonders.»" - Bertolt Brecht
-
"Hier gibt's was auf die Ohren" - Thewall.de bei last.fm (Was ist last.fm?)

So hier ist mal meine Page. ^^

Ä-Team for life!

i see nothing?

Michael Z (rL) = Terminator525 (vL)

http://www.x-moep.de ich dächt ich hätts mit hingeschrieben >.<

Ä-Team for life!

Da fehlt eine About-Sektion.

naja, dafür das du den thread einfach für deine zwecke missbrauchst ...
- der header ist viel zu groß
- die seite ist viel zu lang (warum knappt 4 seiten, wenn der inhalt auch auf eine gebracht werden könnte?)
- ein paar paddings wären angebracht
- die überschriften/menupunkte haben eine wirklich eklige schriftart (scheint wohl der blog-welle entsprungen)
- warum sind die hellen kästen rechts und links in den ecken nicht abgerundet, wie der dunkle kasten in der mitte? und warum fallen die kästen in den schatten?
- die "verfasst von ..." zeile unter dem eintrag hat keinen rahmen. wenn die keinen rahmen haben soll, dann wenigstens 2px kleiner machen
- irgendwie läd die seite ewig lange (obwohl ja nicht viel drauf ist)

macht unterm strich:
- headergrafik gefällt
- rest ist eher mau - optisch wie auch technisch

*e*
nicht zu vergessen:
- recht unübersichtliches script-zusammengewürfel

"selbermachen rockt am meisten :D" - -LeJean-

Exakt so siehts aus, das mit dem header und mit den überschriften kann cih zwar nicht verstehn aber im rest hast du so zemlich recht, du solltest mal die page mit unterschiedlichen Brwosern betrachten, bin eh grad am PHP lernen und bei der nächsten version werden dann nur von mir gemachte scripte vorhanden sein (POTM und downloadscript sind bei der Version schon selbst gescriptet, bedarf aber noch an bessereung)
das mit den abrundungen is so ne sache...vorher waren da statt tabellen nur grafiken als das menü, wegen ladezeit)

x-moep ist sowieso noch ziemlich unausgereift und.... naja buggy will cih net sagen bloss halt unoptimiert.
UNd da werden sicherlich net 2 Stylesheets auf einer Seite ihren PLatz finden (war News und Votingtechnisch bedingt)

danke für die kritik

Ä-Team for life!

http://www.kram-hochladen.de/download.php?id=NTk4MzI=
so siehts bei mir aus ... also viel vom inhalt sehe ich da nicht.

"selbermachen rockt am meisten :D" - -LeJean-

so siehts bei mir auch aus (und das ist hier mitm Laptop/Touchpad nicht so toll dauernd hoch und runter...)

O o
/¯¯/_o___o___o___o____o__
\__\¯¯o¯¯¯o¯¯¯¯¯¯o¯¯¯¯¯¯o
i'm doctoroctogonnafuckinggonnapus blaaaaaaaaaaargggggg-

Hey, was in meinem thread los :D

Sir_Prize postete

Zitat:

bei dem menu ist der fehler auch ziemlich deutlich: die div box 'menu' ist vollkommen leer, daher wird sie mit ner höhe von 0 px gerendert. bei meinem code hat es einen sinn, dass die einzelnen boxen ineinander geschachtelt sind. zum thema "height: 100%": eine %-angabe is "je nach CSS-Eigenschaft relativ zur elementeigenen Größe, oder zu der des Elternelements, oder zu einem allgemeineren Kontext." (zitat selfthtml). soll heißen, dass man das nicht immer genau bestimmen kann. d.h. bei width für relative designs ganz brauchbar aber bei height fast immer ziemlich unberechenbar. (afaik).
wie auch immer. schachtel die boxen (dafür sind sie da) und es wird funktionieren.

<div class="menu"></div>
<ul id="menu_text">
<li><a href="index.html">Portal</a></li>
<li><a href="webdesign.html">Webdesign</a></li>
<li><a href="mm.html">Mapping & Modeling</a></li>
<li><a href="downloads.html">Downloads</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
<li><a href="impressum.html">Impressum</a></li>
</ul>

Wenn man sowas nicht sieht, kann man natürlich viel versuchen ohne Erfolg :(

Bleibt noch die Geschichte mit dem float, na mal schauen...
Hab das Problem, dass der Content-Teil (540px) nicht nach oben rutscht auf Höhe des Inhaltsverzeichnisses (260px) bei einer Fensterbreite von 800px. oO I'm confused...

http://schascha.pytalhost.de

Weiß der Mapper keinen Rat mehr, dann baut er entweder Kisten oder fragt mal bei "thewall.de" nach!

ich plädiere dafür, dass die diskussion um die page von black_cage in den webdesign pics thread verschoben wird. schließlich ist das der threadin dem odin sein (mehr oder weniger ^^) fertige page vorgestellt hat, an der jetzt halt noch weitergearbeitet wurde. (auch das hätte im webdesign pics thread passieren können, aber nun issses ja etwas spät...).

aber das ding von black cage kann ja bestenfalls als WIP eingestuft werden. ich poste ja auch nicht die wip-shots meiner map in nem presentationthread von irgendner anderen map (von jemandem anders).
mal ganz abgesehen davon das dieses design noch wesentlich mehr überarbeitung braucht als das von odin. (horizontale scrollbalken sucken übrigens)

"Herr Keuner sagte: «Schwierig ist, diejenigen zu belehren, auf die man zornig ist. Es ist aber besonders nötig, denn sie brauchen es besonders.»" - Bertolt Brecht
-
"Hier gibt's was auf die Ohren" - Thewall.de bei last.fm (Was ist last.fm?)

x_O Sooo sollte es nun wirklich nicht aussehen ^^

und so hier sollte es aussehen:

http://img108.imageshack.us/img108/8181/clipboard01hy0.jpg

aber das mit dem "sollte" ist ja so ne sache ^^

wird ne neue version geben...das wird dann schon die fünfte..

Ä-Team for life!

Okay, habs jetzt erstmal ohne float versucht und hab wieder auf Tabellen zurückgegriffen, allerdings hat sich da wieder ein unschöner fehler mit eingeschlichen.

Mozilla:

Quelltext:

CSS:

Quellcode:*
{
    border: 0px;
    padding: 0px;
    margin: 0px;
}

body
{
    background: #999999;
}

#wrapper
{
    width: 800px;
    min-height: 100%;
    background-color: #FFFFFF;
    margin-left: auto;
    margin-right: auto;
}

#header
{
    background: url('header.jpg') no-repeat top left;
    height: 200px;
    width: 800px;
}

#content_top
{
    background: url('content_top.jpg') no-repeat top left;
    height: 45px;
    width: 800px;
}

#content
{
    background: url('content.jpg') repeat-y top left;
    min-height: 100%;
    width: 800px;
}

.content_text
{
    width: 450px;
      margin-bottom: 10px;
    padding: 10px;
      border: 1px dashed #CCCCCC;
    font-size: 11px;
    color: #666666;
    font-family: Calibri;
}

#content_bottom
{
    background: url('content_bottom.jpg') no-repeat top left;
    height: 45px;
    width: 800px;
}

.menu_top
{
    background: url('menu_top.jpg') no-repeat top left;
    height: 32px;
    width: 260px;
}

.menu
{
    background: url('menu.jpg') repeat-y top left;
    min-height: 100%;
    width: 260px;
}

.menu_bottom
{
    background: url('menu_bottom.jpg') no-repeat top left;
    height: 45px;
    width: 260px;
}

ul#menu_text
{
      width: 180px;
    margin-left: 60px;
    margin-right: 20px;
      margin-bottom: 10px;
    font-size: 18px;
    color: #666666;
    font-family: Calibri
}

ul#menu_text li {
    list-style: none;
    border-bottom: 1px solid #CCCCCC;
}    

ul#menu_text a:link
{
    color: #666666;
    text-decoration: none;
}

ul#menu_text a:visited
{
    color: #666666;
    text-decoration: none;
}

ul#menu_text a:hover
{
    color: #666666;
    text-decoration: none;
    font-weight: bold;
}

ul#menu_text a:active
{
    color: #666666;
    text-decoration: none;
}

.stil1
{
    color: #6FAEE1;
    font-size: 24px;
}

.stil2
{
    color: #999999
}

a.content_bottom_text
{
    font-size: 11px;
    color: #666666;
    font-family: Calibri;
    text-decoration: none;
}

a.content_bottom_text:link
{
    color: #666666;
    text-decoration: none;
}

a.content_bottom_text:visited
{
    color: #666666;
    text-decoration: none;
}

a.content_bottom_text:hover
{
    color: #666666;
    text-decoration: none;
    font-weight: bold;
}

a.content_bottom_text:active
{
    color: #666666;
    text-decoration: none;
} HTML:

Quellcode:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Schascha - Portal</title>
<link rel="stylesheet" type="text/css" href="images/style.css">
</head>
<body>
<div id="wrapper">
  <p id="header"></p>
  <p id="content_top"></p>
  <div id="content">
  
  <table width= 800px>
   <td width="260" align="left" valign="top">
    <div class="menu">
    <!-- Inhaltsverzeichnis -->
     <div class="menu_top"></div>
      <ul id="menu_text">
       <li><a href="index.html">Portal</a></li>
       <li><a href="webdesign.html">Webdesign</a></li>
       <li><a href="mm.html">Mapping & Modeling</a></li>
       <li><a href="downloads.html">Downloads</a></li>
       <li><a href="kontakt.html">Kontakt</a></li>
       <li><a href="impressum.html">Impressum</a></li>
      </ul>
     <div class="menu_bottom"></div>
    <!-- Besucherzähler -->
     <div class="menu_top"></div>
     <div class="menu_bottom"></div>
    <!-- Links -->
     <div class="menu_top"></div>
     <div class="menu_bottom"> </div>
    </div>
   </td>
  
   <td width="480" align="left" valign="top">
  
   <!-- Text -->
   <div class="content_text">
    <table width= 100% border="0" cellspacing="0" cellpadding="0">
     <td width="115" align="left" valign="top"><img src="images/icons/webdesign.jpg" width="110" height="80"></td>
     <td width="345" align="left" valign="top"><p class="stil1">Schascha SELFHTML</p><p class="stil2">Mittwoch 11. April 2007</p></td>
    </table>
    <p>Hier steht Text.</p>
   </div>
   <div class="content_text">
    <table width= 100% border="0" cellspacing="0" cellpadding="0">
     <td width="115" align="left" valign="top"><img src="images/icons/webdesign.jpg" width="110" height="80"></td>
     <td width="345" align="left" valign="top"><p class="stil1">Schascha geht online</p><p class="stil2">Dienstag, 10. April 2007</p></td>
    </table>
    <p>Diese Website bekommt einen neuen Anstrich. Das neue Design soll benutzerfreundlich und nützlich zugleich sein. Neu zur Internetseite hinzugekommen ist der Download-Bereich.</p>
   </div>
   <div class="content_text">
    <table width= 100% border="0" cellspacing="0" cellpadding="0">
     <td width="115" align="left" valign="top"><img src="images/icons/webdesign.jpg" width="110" height="80"></td>
     <td width="345" align="left" valign="top"><p class="stil1">Wellness-Lichtpunkt Update</p><p class="stil2">Montag, 09. April 2007</p></td>
    </table>
    <p>Update der Internetseite "<a href="http://wellness-lichtpunkt.com/" target="_blank">www.wellness-lichtpunkt.com</a>". Im Vergleich zum Vorgänger, entstand die Website vollständig in Macromedia Dreamworks, wobei ich viel mit CSS und SELFHTML gearbeitet habe.</p>
   </div>
    </td>
    <td width="60" align="left" valign="top"></td>
  </table>

  <!-- Bottom -->    
  <div id="content_bottom">
   <div>
    <table width= 800px border="0" cellspacing="0" cellpadding="0">
     <td width="650" align="left" valign="top"></td>
     <td width="25" align="left" valign="top"><img src="images/icons/seitenanfang.jpg" width="20" height="20"></td>
     <td width="65" align="left" valign="center"><a href="index.html" class="content_bottom_text">Seitenanfang</a></td>
     <td width="60" align="left" valign="top"></td>
    </table>
  </div>
</div>
</body>
</html>

http://schascha.pytalhost.de

Weiß der Mapper keinen Rat mehr, dann baut er entweder Kisten oder fragt mal bei "thewall.de" nach!

wie wär's eigentlich mal, wenn du deine fehler beschreibst ... sollen wir raten, oder wie?

"selbermachen rockt am meisten :D" - -LeJean-

Muss entweder irgendein margin- oder padding-Wert oder bei der Tabellenberechnung was falsch sein...

http://schascha.pytalhost.de

Weiß der Mapper keinen Rat mehr, dann baut er entweder Kisten oder fragt mal bei "thewall.de" nach!

solange du tabellen benutzt, helf ich dir nicht :P
ausserdem ist dein content-teil immer noch 800px breit. wieso? wie soll das passen? kein wunder, dass dan rendering fehler auftauchen.

"Herr Keuner sagte: «Schwierig ist, diejenigen zu belehren, auf die man zornig ist. Es ist aber besonders nötig, denn sie brauchen es besonders.»" - Bertolt Brecht
-
"Hier gibt's was auf die Ohren" - Thewall.de bei last.fm (Was ist last.fm?)

Hatte mir das so gedacht:

Der content-Teil liegt also unter dem Menu und dem Text, wodurch es doch eigentlich passen müsste, da Menu und Text zusammen 800px ergeben. Kann natürlich sein, dass ich zu sehr in Tabellen denke ;)

http://schascha.pytalhost.de

Weiß der Mapper keinen Rat mehr, dann baut er entweder Kisten oder fragt mal bei "thewall.de" nach!

für die 800 px begrenzung ist doch der wrapper da.
content.top für den oberen rand, content für den eigentlich en inhalt und content.bottom für den unteren rand. ineinander geschachtelt und 540px breit
daneben dann menuleiste mit ner breite von 260px und darin dann die menuelemente (wieder ineinander geschachtelt).

so macht es imo am meisten sinn.

"Herr Keuner sagte: «Schwierig ist, diejenigen zu belehren, auf die man zornig ist. Es ist aber besonders nötig, denn sie brauchen es besonders.»" - Bertolt Brecht
-
"Hier gibt's was auf die Ohren" - Thewall.de bei last.fm (Was ist last.fm?)

Mal noch was anderes, wie würdet Ihr am besten die Linkliste über CSS schreiben. Die Links sind 88x31px groß und sollen einen Abstand von 2px zum nächsten haben.

http://schascha.pytalhost.de

Weiß der Mapper keinen Rat mehr, dann baut er entweder Kisten oder fragt mal bei "thewall.de" nach!

die bilder einfach als solche einbinden (mit alt-text!) und verlinken und den bildern über css nen padding-left: 2px geben

"Herr Keuner sagte: «Schwierig ist, diejenigen zu belehren, auf die man zornig ist. Es ist aber besonders nötig, denn sie brauchen es besonders.»" - Bertolt Brecht
-
"Hier gibt's was auf die Ohren" - Thewall.de bei last.fm (Was ist last.fm?)

Okay, hab dann mal eine neue Version der Startseite hochgeladen. Habe jetzt erstmal eine Mischung aus Tabellen und CSS gemacht, war mir irgendwie nix mit den Fehlern bei Float. Aber denke mal ist erstmal so okay.

Schascha 1.4

http://schascha.pytalhost.de

Weiß der Mapper keinen Rat mehr, dann baut er entweder Kisten oder fragt mal bei "thewall.de" nach!

die Schrift ist im Firefox minimal größer (und andere Schriftart) als im iex -> der Menüpunkt Mapping & Modeling bricht um weil er nicht reinpasst und fängt an zu flattern. Liegt daran das ich die Schriftart Calibri nicht habe... bei sowas immer als letzte Möglichkeit eine font-family angeben, also bei dir z.B. font-family:Calibri,Times New Roman, Western;

ansonsten gefällts.

O o
/¯¯/_o___o___o___o____o__
\__\¯¯o¯¯¯o¯¯¯¯¯¯o¯¯¯¯¯¯o
i'm doctoroctogonnafuckinggonnapus blaaaaaaaaaaargggggg-

schade, da gibt man sich extra viel mühe und da wird beim ersten kieselsteinchen im weg gleich aufgegeben.

"Herr Keuner sagte: «Schwierig ist, diejenigen zu belehren, auf die man zornig ist. Es ist aber besonders nötig, denn sie brauchen es besonders.»" - Bertolt Brecht
-
"Hier gibt's was auf die Ohren" - Thewall.de bei last.fm (Was ist last.fm?)

:D sorry sir prize...
aber sowas lernt man halt nur nach und nach und nicht innerhalb einer Woche, und ich würde gerne die Website ersteinmal abschließen, da ich nebenbei noch an zwei weiteren arbeite und noch Abitur mache. Wenigstens bin ich jetzt von Frontpage los gekommen und schreibe mehr selbst.

http://schascha.pytalhost.de

Weiß der Mapper keinen Rat mehr, dann baut er entweder Kisten oder fragt mal bei "thewall.de" nach!