Ergebnis 1 bis 2 von 2

Thema: [HTML+CSS] DIV SCroll-Problem

  1. #1
    Unregistriert
    Gast

    Standard [HTML+CSS] DIV SCroll-Problem

    Hallo

    ich habe jetzt mehrere Stunden an einem CSS-basiertem Layout (nur HTML+CSS) gearbeitet und komme einfach nicht mehr weiter.

    Das Problem ist folgendes:
    Der DIV #content2 endet nicht am DIV #foot (trotz clear:both), sondern läuft dahinter weiter (nur, weil die Eltern-Elemente "overflow:hidden" haben, wird die Seite nicht unter dem footer fortgesetzt.).

    Zum zweiten kriege ich es nicht hin, dass man in diesem DIV ordentlich scrollen kann.

    Die HTML-Datei (ohne body, head, html, doctype, etc.):
    Code:
    <div id="content">
    	
    <div id="head">
    HEAD
    </div>
    
    <div id="content2">
    CONTENT
    </div>
    
    <style="clear:both">
    
    <div id="foot">
    FOOT
    </div>
    
    </div>
    
    
    <div id="left"></div>
    <div id="right"></div>
    und die zugehörige CSS-Definition:

    Code:
    @charset "utf-8";
    
    /*PARENT*/
    HTML, BODY {
    	margin: 0;
    	padding: 0;
    	height: 100%;
    }
    
    /*CHILD1*/
    #left {
    	float: left;
    	background-color: #00F;
    	width: 50%;
    	height: 100%;
    }
    
    /*CHILD2*/
    #right {
    	background-color: #00F;
    	float: right;
    	width: 50%;
    	height: 100%;
    }
    
    
    /*CHILD3*/
    #content {
    	margin: 0 auto;
    	left: 50%;
    	margin-left:-500px;
    	width: 1000px;
    	position: absolute;
    	min-height: 100%;
    	height: auto;
    	border-left-style: inset;
    	border-right-style: outset;
    	border-color: black;
    	overflow: auto;
    	
    }
    
    /*IE HACK CHILD3*/
    * html #content
    {
        height: 100%;
    }
    
    /*GRANDCHILD1*/
    #head {
    	width: 1000px;
        height: 150px;
    	overflow: hidden;
    	background-color:#3F0;
    	position: fixed;
    }
    
    /*GRANDCHILD2*/
    #content2 {
    	background-color: #C00;
    	width: 1000px;
    	overflow: auto;
    	min-height: 100%;
    	height: auto;
    	position: fixed;
    	margin-top: 150px;
    	margin-bottom: 10cm;
    }
    
    /*IE HACK GRANDCHILD2*/
    * html #content2
    {
        height: 100%;
    }
    
    /*GRANDCHILD3*/
    #foot {
    	width: 1000px;
    	height: 21px;
    	overflow: hidden;
    	background-color:#03F;
    	bottom: 0pt;
    	position: fixed;
    }
    Statt HEAD; FOOT, CONTENT einfach einen langen Text einkopieren (ich will meinen Beitrag hier nicht zu lang werden lassen, deshalb habe ich meine Beispieltexte durch diese Platzhalter ersetzt).
    ich wäre sehr dankbar, wenn mir jemand helfen könnte, zum einen den content2-DIV ordentlich abzuschließen, und zum anderen eine ordentliche Scroll-Funktion einzubauen !
    Vielen Dank!

    Philipp
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Unregistriert
    Gast

    Standard AW: [HTML+CSS] DIV SCroll-Problem

    /EDIT (als Gast kann man leider nicht editieren ) :

    Das Scroll-Problem ist, dass der Scrollbalken NUR zu sehen sein soll, wenn der Text zu lang wird. Mit "overflow:scroll" ist der Balken aber immer zu sehen, und anders funktioniert das Scrollen überhaupt nicht ?!?!

Ähnliche Themen

  1. Problem mit Scroll-Balken HTML
    Von creonisita im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 20.07.2008, 13:36
  2. Suche bestimte Scroll-HTML
    Von HTML Momo im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 04.08.2007, 12:52
  3. iframe und scroll to
    Von KrAUsE im Forum HTML & CSS Forum
    Antworten: 16
    Letzter Beitrag: 14.07.2007, 18:11
  4. Scroll-Leiste
    Von desman im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 20.03.2007, 22:49
  5. Nur Horizontaler Scroll (?)
    Von FreshMiller im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 01.06.2004, 16:18

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •