mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 26.04.2024 15:35 Benutzername: Passwort: Auto-Login

Thema: Ein Problem mit css vom 24.10.2007


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Ein Problem mit css
Seite: 1, 2  Weiter
Autor Nachricht
schattenjaeger
Threadersteller

Dabei seit: 03.11.2005
Ort: Kiel
Alter: 34
Geschlecht: Männlich
Verfasst Mi 24.10.2007 19:52
Titel

Ein Problem mit css

Antworten mit Zitat Zum Seitenanfang

Hi Leute, ich bastel mal wieder eine HP und stoße auf ganz tolle Probleme..

zum einen: ich habe einen "hintergrund-Div" indem alle anderen sitzen. (in dem fall main)

Code:

<div id="main">
<div id="logo" > </div>
<div id="content"></div>
</div>


Code:


#main { position:absolute; width:720px;  left:50%; margin-left:-360px; background-color: #ffffff; border-left: 1px #999999 solid; border-right:1px #999999 solid;  }



Also wenn content bis z.B. 800 px auf der einen Seite reicht und auf der anderen bis z.B. 1200px kann ich für main ja keine fixe höhe nehmen.

Wie mache ich das im CSS code? Wenn ich height:100%; einsetze, dann ist das ja nur bis Bildschirmende. Wenn gescrollt werden muss, dann ist aufeinmal nichts mehr da von dem hintergrund.


vielen dank für eure hilfe.


Zuletzt bearbeitet von schattenjaeger am Mi 24.10.2007 20:01, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mi 24.10.2007 20:30
Titel

Antworten mit Zitat Zum Seitenanfang

Du gibst einfach gar keine höhe an. Oder aber falls du eine Mindesthöhe meinst,
dann kannst du das in etwa so lösen:

Code:
        min-height: 800px;
        height: auto !important;
        height: 800px;


So wäre das Element immer mindestens 800px hoch oder aber höher falls mehr
Inhalt vorhanden wäre.


Zuletzt bearbeitet von m am Mi 24.10.2007 20:32, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
schattenjaeger
Threadersteller

Dabei seit: 03.11.2005
Ort: Kiel
Alter: 34
Geschlecht: Männlich
Verfasst Mi 24.10.2007 20:31
Titel

Antworten mit Zitat Zum Seitenanfang

in dem beispiel hier gebe ich auch keine höhe an, da mri das ein rätsel...

mit 100% habe ich es schon probiert und eine feste px höhe will ich auch nicht

Ich will eine höhe die sich dem contentbereich anpasst.


Edit: dein vorschlag funnzt nicht. // Anmerkung: min-height wird vom IE6 nur bei Tabellen verstanden. In Safari 1 gar nicht. Siehe http://www.css4you.de/min-height.html


Zuletzt bearbeitet von schattenjaeger am Mi 24.10.2007 20:39, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mi 24.10.2007 20:57
Titel

Antworten mit Zitat Zum Seitenanfang

Probier es erst mal aus bevor du behauptest es funktioniert nicht.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
schattenjaeger
Threadersteller

Dabei seit: 03.11.2005
Ort: Kiel
Alter: 34
Geschlecht: Männlich
Verfasst Mi 24.10.2007 20:58
Titel

Antworten mit Zitat Zum Seitenanfang

Hab ich getan.
  View user's profile Private Nachricht senden
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mi 24.10.2007 21:02
Titel

Antworten mit Zitat Zum Seitenanfang

schattenjaeger hat geschrieben:
Hab ich getan.


Dann hast du es nicht korrekt getan *zwinker* Zeig mal den kompletten Quelltext.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
schattenjaeger
Threadersteller

Dabei seit: 03.11.2005
Ort: Kiel
Alter: 34
Geschlecht: Männlich
Verfasst Mi 24.10.2007 21:06
Titel

Antworten mit Zitat Zum Seitenanfang

HTML

Code:
<!--Head-->
<!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=utf-8" />
<title>Praxis für Hypnose- und Psychotherapie</title>
<link href="resources/css/screen.css" rel="stylesheet" type="text/css" />
</head>
<!--Head-Ende-->

<body>
<div id="main">


<div id="logo"><img src="resources/design/logo.jpg" alt="Praxis für Hypnose- und Psychotherapie ####" width="700" height="30" /> </div>

<div id="header"><img src="resources/design/header1.jpg" width="700" height="250" /></div>


<!--Navigation-->

<!--navigation Ende-->


<!--Content-->
<div id="content">
  <h2>Ein unnötiges Leiden - psychische Problem</h2>
  <p>Psychische Erkrankungen können jeden treffen und stellen eine  schwere Belastung für die Betroffenen und deren Angehörigen dar, mit  beträchtlichen sozialen und wirtschaftlichen Folgen. Diese Erkrankungen   sind  in den letzten 1o Jahre dramatisch angestiegen,  zwischen 20-30%  der Bevölkerung leiden darunter und es werden immer mehr.<br clear="all" />
    <br />
    Psychische  Erkrankungen passen so gar nicht in das Bild der heutigen Zeit, einer  Zeit, in der Jugendlichkeit, Fitness und Konkurrenzfähigkeit die  bestimmenden Werte einer Leistungsgesellschaft geworden sind und immer  zu einer sozialen Verunsicherung führen. Paradoxerweise sind aber  gerade psychische Störungen die dunklen und verdrängten Folgen dieser  gesellschaftlichen Bedingungen, die sich immer mehr ausbreiten. </p>
  <p>&nbsp;</p>
  <p>Psychische Erkrankungen können jeden treffen und stellen eine  schwere Belastung für die Betroffenen und deren Angehörigen dar, mit  beträchtlichen sozialen und wirtschaftlichen Folgen. Diese Erkrankungen   sind  in den letzten 1o Jahre dramatisch angestiegen,  zwischen 20-30%  der Bevölkerung leiden darunter und es werden immer mehr.<br clear="all" />
 
</div>
<!--Content Ende-->

<div id="second_content">
<div id="second_content_inner">
  <h4>Rauchen - ein Laster</h4>
  <p>100 000 Raucher sterben jedes Jahr in Deutschland an den Folgen ihrer  Sucht. Das sind 300 am Tag. Es ist, als würde jeden Tag ein voll  besetztes Flugzeug abstürzen und keiner registriert das, keiner regt  sich darüber auf.</p>
  <p><br />
  Lesen Sie hier mehr ...</p>
</div>
</div>
</div>


<div id="footer">
<div id="footer_inner">
  <div align="center">### ###2007 | Impressum</div>
</div>
</div>



</body>
</html>


CSS

Code:
@charset "utf-8";
/* CSS Document */

body {margin:0 0 0 0; padding: 0 0 0 0; background-image:url(../design/back.jpg); background-color: #ffcc00; background-position:top; background-repeat:repeat-y; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px; }

   #main { position: relative; width:720px; left:50%; margin-left:-360px; background-color: #ffffff; border-left: 1px #999999 solid; border-right:1px #999999 solid;  }

#logo { position:absolute; width:700px; height:30px; left:50%; margin-left:-350px; margin-top:15px; }

#header {position:absolute; width:700px; height:250px; left:50%; margin-left:-350px; margin-top:55px; border: 1px #CCCCCC solid; }

#nav1-1 { position:absolute; width:100px; height:20px; margin-left:40px; margin-top:315px; background-color: #FF9900 }

#nav1-2 { position:absolute; width:100px; height:20px; margin-left:150px; margin-top:315px; background-color: #CCCCCC }

#nav1-3 { position:absolute; width:100px; height:20px; margin-left:260px; margin-top:315px; background-color:#CCCCCC }

#nav1-4 { position:absolute; width:100px; height:20px; margin-left:370px; margin-top:315px; background-color:#CCCCCC }

#nav1-5 { position:absolute; width:100px; height:20px; margin-left:480px; margin-top:315px; background-color:#CCCCCC }

#nav2   {position:absolute; width:540px; height:20px; margin-left:40px; margin-top:335px; background-color: #FFCC00; }

#nav2-1 { position:absolute; width:100px; height:20px; margin-left:40px; margin-top:335px; background-color: #FFCC00 }

#nav2-2 { position:absolute; width:100px; height:20px; margin-left:150px; margin-top:335px; background-color: #FFCC00 }

#nav2-3 { position:absolute; width:100px; height:20px; margin-left:260px; margin-top:335px; background-color: #FFCC00 }

#nav2-4 { position:absolute; width:100px; height:20px; margin-left:370px; margin-top:335px; background-color: #FFCC00 }

#nav2-5 { position:absolute; width:100px; height:20px; margin-left:480px; margin-top:335px; background-color: #FFCC00 }


#content {
   position:absolute;
   width:440px;
   height:300px;
   margin-top:310px;
   margin-left:10px;
}

#second_content {position:absolute; width:249px; height:300px; margin-top:325px; margin-left:470px; background-color: #ffcc66; border-left: 1px #999999 solid; border-bottom:1px #999999 solid; border-top: 1px #999999 solid; }
#second_content_inner {position:absolute; width:190px; margin-left:5px; margin-top:5px;}

#footer { position: absolute; width:720px; height:30px; left:50%; margin-left:-360px;  background-color: #ffffff; border-left: 1px #999999 solid; border-right:1px #999999 solid; }
#footer_inner {position:absolute; width:700px; margin-left:10px; margin-top:5px;}


Zuletzt bearbeitet von schattenjaeger am Mi 24.10.2007 21:16, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mi 24.10.2007 21:16
Titel

Antworten mit Zitat Zum Seitenanfang

Gibt es einen bestimmten Grund dafür dass du in den Quirksmode switcht? Zudem positionierst
du ja alles absolut, woran sollte sich dann die höhe des Elementes (#main) orientieren?
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen Formmailer-Problem-neues problem
SQL-Problem
PS Problem
Problem mit div
IE PNG FIX Problem
css-problem
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.