  |
| Autor |
Nachricht |
BiBaButzemann
Erfahrener [User]
Anmeldung: 25.06.06
Beiträge: 91
Wohnort: Moers
|
 Verfasst am: 17.02.2007, 13:16 Titel: Problem mit divLayern bei Homepage FairLife |
 |
|
Hallo,
ich bins mal wieder und hab wieder ein Problem mit divLayern!
Diesmal sind es leider wohl mehrere Probleme die es zu lösen gilt und wo ich absolut nicht weiter komme. Ich hab ja vorher mit Tabellen gearbeitet, jetzt nicht mehr - sondern mit divLayern. Aber da komm ich nicht ganz klar! Vielleicht guckt ihr euch mal die Seite an:  http://www.fairlife-projekt.de/v2/templates/default/ sowohl im FF als auch im IE. Die IE Version kommt schon sehr gut an das Erscheinungsbild ran welches ich gerne haben möchte. Dort sind nur 3 Fehler.
1. sind die beiden Menüs nicht genau unter dem Banner, ich hab dem Banner gesagt das er einen äußeren Rand von 1% hat. Bei den Menüs scheint das exakt 2% zu sein.
2. Wenn ich das Browser Fenster verkleinere auf eine bestimmt Größe wird "Main" nicht mehr in der Seiten Mitte zwischen den beiden Menüs angezeigt, sondern unten!
3. Möchte ich gerne (zum Vorbehalt) das wenn ich "Main" über den divLayer hinaus geht das die Menüs und das Banner eine feste Position haben und nur "Main" gescrollt werden kann.
So - das wären die Probleme beim IE. Sonst ist die HP für den IE gut (Grundgerüst natürlich)
Jetzt fängts erst richtig an mit dem Mist  , nämlich im FF
Da hat der "Main" Layer gar kein Ende.
Ich kenn mich leider wirklich nicht gut mit divLayern aus nur ein Kollege den ich mal gefragt habe leider auch nicht wirklich. Er schlägt mir völlig sinnlose Sachen vor. Ich geb euch hier mal beide Codes von der index.php und einmal von dem Style default.css
| Code: |
/*
##########################################
# FairLife Version 2.0 #
# © Copyright 2007 by Jörg J. #
# Alle Rechte vorbehalten #
##########################################
# http://www.fairlife-projekt.de #
# info@fairlife-projekt.de #
# webmaster@fairlife-projekt.de #
##########################################
*/
body, html {
width:100%;
}
body {
margin:0; padding:0;
background:#0044CC;
color:#FFFFFF;
overflow:auto;
}
.banner {
position:static;
height:80px;
background:#0077CC;
margin:1%; padding:3px;
text-align:center;
z-index:3;
}
.menue {
position:static;
float:left;
width:10%; min-height:650px;
margin-left:1%; margin-right:1%;
background:#0077CC;
text-align:center;
z-index:1;
}
.main {
float:none;
overflow:auto;
min-height:650px;
background:#0099CC;
z-index:2;
text-align:center;
}
.menue2 {
position:static;
float:right;
width:10%; min-height:650px;
margin-left:1%; margin-right:1%;
background:#0077CC;
text-align:center;
z-index:3;
}
/* Nur für IE */
* html body {
width:100%;
overflow:hidden;
}
* html .banner {
position:static;
height:80px;
}
* html .menue {
float:left;
position:static;
width:10%; height:80%;
}
* html .main {
float:none;
height:80%;
}
* html .menue2 {
float:right;
position:static;
width:10%; height:80%;
}
|
index.php
| Code: |
<!--
##########################################
# FairLife Version 2.0 #
# © Copyright 2007 by Jörg J. #
# Alle Rechte vorbehalten #
##########################################
# http://www.fairlife-projekt.de #
# info@fairlife-projekt.de #
# webmaster@fairlife-projekt.de #
##########################################
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="style/default.css" />
<title>FairLife</title>
</head>
<body>
<div class="banner">Banner</div>
<div class="menue">Menü</div>
<div class="menue2">Menü</div>
<div class="main">
<p>sadfffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p> [...]
</div>
</body>
</html>
|
Es wird mit Sicherheit in CSS vielleicht viel falsch sein oder auch unnötig. Nur besser hab ich es nicht hinbekommen. Hoffe das ihr mir da helfen könnt!
Ich bitte auch darauf zu achten das ich hier den Code nicht gepostet habe damit er für eigene HP's kopiert wird oder so. Obwohl - im Moment ist das ja eh nur ein "Grundgerüst" Aber trotzdem
_________________
Mit freundlichen Grüßen
BiBaButzemann
|
|
| Nach oben |
|
 |
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 480
|
| Verfasst am: 17.02.2007, 20:24 Titel: |
|
|
Probier's mal mit folgendem CSS-Code:
| Code: | body {
margin:0; padding:0;
background:#0044CC;
color:#FFFFFF;
}
#banner {
height:80px;
background:#0077CC;
margin:1%; padding:3px;
text-align:center;
}
#menue {
float:left;
width:10%; min-height:650px;
margin-left:1%;
background:#0077CC;
text-align:center;
}
*html #menue {margin-left:0.5%;}
#main {
width:auto
overflow:auto;
height:650px;
background:#0099CC;
margin:0 12%;
text-align:center;
}
#menue2 {
float:right;
width:10%; min-height:650px;
margin-right:1%;
background:#0077CC;
text-align:center;
}
*html #menue2 {margin-right:0.5%;} |
Damit passt sich die Seite auch verkleinerten Fenstergrößen an.
Dass die Schrift momentan dennoch ins menue2 hineinragt liegt daran, dass du im Text bzw. in deinen Buchstaben keine Leerzeichen hast. Bei normalem Text ist das kein Problem.
Viel Erfolg!
|
|
| Nach oben |
|
|
BiBaButzemann
Erfahrener [User]
Anmeldung: 25.06.06
Beiträge: 91
Wohnort: Moers
|
| Verfasst am: 17.02.2007, 23:46 Titel: |
|
|
Hi,
danke ^^
damit werd ich erstmal weiter arbeiten. Ist zwar noch nicht ganz so wie ich das haben möchte aber ich guck mal weiter!
Ehm, aber eins musst du mir mal bitte erklären!
Wieso bei dem HTML Code (in CSS) bei den beiden Menüs menue1 einen linken Abstand von 0,5% und bei menue2 einen rechten Abstand von 0,5% =?????
Das versteh ich überhaupt nicht!
Wieso das?
_________________
Mit freundlichen Grüßen
BiBaButzemann
|
|
| Nach oben |
|
|
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 480
|
| Verfasst am: 18.02.2007, 11:14 Titel: |
|
|
Zunächst mal:
Im HTML-Teil musst du jeweils "class" durch "id" ersetzten, hab' ich vergessen drauf hinzuweisen. ID's nimmt man für einmalige Elemente auf einer Seite, "class" für Elemente, die mehrmals auf einer Seite vorkommen können.
Der IE interpretiert manchmal margin- und padding-Werte anders als der FF und verhält sich damit nicht regelkonform. Durch entsprechende "Hacks" kann man ihn jedoch überlisten. Da er 1% als 2% interpretiert hat, sind die 0.5 % nur für den IE gedacht was mit Voranstellen von "*html" erreicht werden kann. Andere Browser können diese "Spezialität" nicht lesen.
|
|
| Nach oben |
|
|
BiBaButzemann
Erfahrener [User]
Anmeldung: 25.06.06
Beiträge: 91
Wohnort: Moers
|
| Verfasst am: 18.02.2007, 13:21 Titel: |
|
|
aha,
jo - nagut. Nur - jetzt ist das "Main" Fenster im FF viel zu "schmal"
 (
_________________
Mit freundlichen Grüßen
BiBaButzemann
|
|
| Nach oben |
|
|
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 480
|
| Verfasst am: 18.02.2007, 15:26 Titel: |
|
|
Bei mir sieht's im IE und FF identisch aus. Wie viel zu schmal?
Verändere mal den margin-wert von 12% bei main und mach dann ggf. für den IE noch eine Zusatzangabe wie beschrieben mit 12%.
|
|
| Nach oben |
|
|
BiBaButzemann
Erfahrener [User]
Anmeldung: 25.06.06
Beiträge: 91
Wohnort: Moers
|
| Verfasst am: 18.02.2007, 15:44 Titel: |
|
|
Ja, ^^
das Problem hab ich gerade eben schon selber gelöst ^^
Aber - jetzt kommt ein weiterer "kleinerer" Fehler den ich nicht haben will.
Die Schrift "läuft über" bei den divLayern.
@sejuma wieso hast du bei allen Layern position:static eigentlich weg gemacht?
_________________
Mit freundlichen Grüßen
BiBaButzemann
|
|
| Nach oben |
|
|
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 480
|
| Verfasst am: 18.02.2007, 15:52 Titel: |
|
|
Die Schrift läuft vermutlich deshalb über, weil du ihr keine Chance zum Umbrechen gibst. Du musst also Leerzeichen wie bei normalem Text eingeben, dann müsste es gehen.
Position static ist überflüssig und hat keinerlei Funktion weil das die Normaleinstellung ist. Damit kann man es auch weglassen. Spart Quellcode, Webspace und macht's übersichtlicher.
|
|
| Nach oben |
|
|
BiBaButzemann
Erfahrener [User]
Anmeldung: 25.06.06
Beiträge: 91
Wohnort: Moers
|
| Verfasst am: 18.02.2007, 17:13 Titel: |
|
|
[quote="sejuma"]Die Schrift läuft vermutlich deshalb über, weil du ihr keine Chance zum Umbrechen gibst. Du musst also Leerzeichen wie bei normalem Text eingeben, dann müsste es gehen. ...
/quote]
Wie meinste das bitte?
Das ist jetzt eine Nachricht von PHP, aber zum ausprobieren reicht das ja - das die Dateien nicht gefunden wurden!
Im IE - sieht das noch schlimmer aus!
_________________
Mit freundlichen Grüßen
BiBaButzemann
|
|
| Nach oben |
|
|
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 480
|
| Verfasst am: 18.02.2007, 17:16 Titel: |
|
|
In diesem "Text"
| Zitat: | | <p>sadfffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</p> |
ist keinerlei Leerzeichen. Also kann auch kein Umbruch stattfinden.
|
|
| Nach oben |
|
|
BiBaButzemann
Erfahrener [User]
Anmeldung: 25.06.06
Beiträge: 91
Wohnort: Moers
|
| Verfasst am: 18.02.2007, 17:23 Titel: |
|
|
Ja, das ist klar ^^
Aber ich meinte jetzt im Moment wie die Seite aussieht!
Ich möchte das die Layer immer genau die angegebene Größe haben (egal ob der Text dann "abgebrochen" wird oder nicht!
Guck dir die HP jetzt noch mal bitte an, da ist jetzt überall ein PHP Code drin z.B.
_________________
Mit freundlichen Grüßen
BiBaButzemann
|
|
| Nach oben |
|
|
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 480
|
| Verfasst am: 18.02.2007, 17:30 Titel: |
|
|
Link?
|
|
| Nach oben |
|
|
BiBaButzemann
Erfahrener [User]
Anmeldung: 25.06.06
Beiträge: 91
Wohnort: Moers
|
|
| Nach oben |
|
|
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 480
|
| Verfasst am: 18.02.2007, 17:45 Titel: |
|
|
Das Problem ist das gleiche: zu langer, ununterbrochener Text.
Wenn du eingibst, wird der Text "abgehackt", d.h. man kann ihn dann nicht mehr lesen.
führt dazu, dass eine Scroll-Leiste erscheint.
|
|
| Nach oben |
|
|
BiBaButzemann
Erfahrener [User]
Anmeldung: 25.06.06
Beiträge: 91
Wohnort: Moers
|
| Verfasst am: 18.02.2007, 17:58 Titel: |
|
|
Jo jo, schon klar - aber
nur - overglow:hidden hab ich im gesamten Body nur im "Main Layer" hab ich overflow:auto
Sollte doch eigentlich richtig sein ne
Ich guck nochmal!
_________________
Mit freundlichen Grüßen
BiBaButzemann
|
|
| Nach oben |
|
|
|
|
