XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   prblemme mit mein inhalt div (http://xhtmlforum.de/showthread.php?t=51544)

carlos587261 23.04.2008 12:00
prblemme mit mein inhalt div
 
div wird nicht grösser wenn der inhalt grösser ist. hier ist der link von meine seite ---> E-Coasters - Only Best Theme Park In Europe - Accueil
Im moment hab ich da eine scroll Bar gemacht aber das ist nicht schön da zwei scroll bars zu haben.

SO hier ist meine Css. Kann jemaden mir helfen :icon_cry:
Code:
@charset "utf-8";
*{margin: 0; padding: 0; }
/* CSS Document */
/* Tags Defs */
body {
        background:#60D7FF url(../img/body.jpg) repeat-x 0 0;
}
/* Layer Defs */
#global {
        position:absolute;
        left: 50%;
        width: 868px;
        height: 1244px;
        margin-left: -434px; /* moitié de la largeur */
        top: 5px;
}

#page {
        position: absolute;
        height: 1244px;
        width: 868px;
}
#header {
        background-color: #0099CC;
        background-image: url(../img/header.jpg);
        height: 200px;
        width: 868px;
}
#clikhome {
        position: absolute;
        height: 18px;
        width: 60px;
        top: 20px;
        right: 44px;
}
#cliknews {
        position: absolute;
        height: 18px;
        width: 62px;
        top: 40px;
        right: 45px;
}
#drapfr {
        position:absolute;
        width:20px;
        height:13px;
        left: 756px;
        top: 160px;
}
#drapde {
        position:absolute;
        width:20px;
        height:13px;
        left: 780px;
        top: 160px;
}
#drapuk {
        position:absolute;
        width:20px;
        height:13px;
        left: 803px;
        top: 160px;
}
#place {
        position: absolute;
        height: 949px;
        width: 868px;
        bottom: 95px;
}
#leftmenufr {
        position: absolute;
        height: 949px;
        width: 32px;
        left: 1px;
        bottom: 0px;
        background-color: #0FA9FF;
        background-image: url(../img/menugauchefr.jpg);
}
#leftmenude {
        position: absolute;
        height: 949px;
        width: 32px;
        left: 1px;
        bottom: 0px;
        background-color: #0FA9FF;
        background-image: url(../img/menugauchede.jpg);
}
#leftmenuus {
        position: absolute;
        height: 949px;
        width: 32px;
        left: 1px;
        bottom: 0px;
        background-color: #0FA9FF;
        background-image: url(../img/menugaucheus.jpg);
}
#lang1fr {
        position: absolute;
        height: 89px;
        width: 24px;
        top: 37px;
        right: 0px;
}
#lang2fr {
        position: absolute;
        height: 71px;
        width: 24px;
        top: 128px;
        right: 0px;
}
#lang3fr {
        position: absolute;
        height: 73px;
        width: 24px;
        top: 200px;
        right: 0px;
}
#lang4fr {
        position: absolute;
        height: 62px;
        width: 24px;
        top: 274px;
        right: 0px;
}
#lang5fr {
        position: absolute;
        height: 50px;
        width: 24px;
        top: 337px;
        right: 0px;
}
#lang6fr {
        position: absolute;
        height: 113px;
        width: 24px;
        top: 388px;
        right: 0px;
}
#lang1de {
        position: absolute;
        height: 70px;
        width: 24px;
        top: 37px;
        right: 0px;
}
#lang2de {
        position: absolute;
        height: 102px;
        width: 24px;
        top: 107px;
        right: 0px;
}
#lang3de {
        position: absolute;
        height: 90px;
        width: 24px;
        top: 210px;
        right: 0px;
}
#lang4de {
        position: absolute;
        height: 120px;
        width: 24px;
        top: 301px;
        right: 0px;
}
#lang5de {
        position: absolute;
        height: 62px;
        width: 24px;
        top: 422px;
        right: 0px;
}
#lang6de {
        position: absolute;
        height: 78px;
        width: 24px;
        top: 485px;
        right: 0px;
}
#lang1us {
        position: absolute;
        height: 70px;
        width: 24px;
        top: 37px;
        right: 0px;
}
#lang2us {
        position: absolute;
        height: 60px;
        width: 24px;
        top: 108px;
        right: 0px;
}
#lang3us {
        position: absolute;
        height: 78px;
        width: 24px;
        top: 168px;
        right: 0px;
}
#lang4us {
        position: absolute;
        height: 45px;
        width: 24px;
        top: 246px;
        right: 0px;
}
#lang5us {
        position: absolute;
        height: 53px;
        width: 24px;
        top: 291px;
        right: 0px;
}
#lang6us {
        position: absolute;
        height: 123px;
        width: 24px;
        top: 344px;
        right: 0px;
}
#main1 {
        position: absolute;
        height: 949px;
        width: 804px;
        left: 32px;
        top: 0px;
}
#mainhaut {
        position: absolute;
        height: 28px;
        width: 804px;
        left: 0px;
        top: 0px;
        background-color: #0EA8FE;
        background-image: url(../img/mainhaut.jpg);
}
#mainmiddle {
        background-color: #FFFFFF;
        position: absolute;
        height: 921px;
        width: 804px;
        left: 0px;
        bottom: 0px;
}
#texte {
        position: absolute;
        height: 920px;
        width: 622px;
        left: 0px;
        top: 0px;
        overflow:auto;
}
#menu {
        position: absolute;
        height: 921px;
        width: 171px;
        top: 0px;
        right: 11px;
        background-color: #00A3FF;
}
#menu1 {
        background-color: #00A3FF;
        background-image: url(../img/multimedia.jpg);
        position: absolute;
        height: 15px;
        width: 158px;
        top: 5px;
        right: 6px;
}

a { color:#001760;}

a:hover { color:#669999;}
a span{ display: none;}
 
#menu11 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 25px;
        right: 8px;
}
#menu12 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 43px;
        right: 8px;
}
#menu2 {
        background-color: #00A3FF;
        background-image: url(../img/coasters.jpg);
        position: absolute;
        height: 15px;
        width: 158px;
        top: 68px;
        right: 6px;
}
#menu21 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 88px;
        right: 8px;
}
#menu22 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 106px;
        right: 8px;
}
#menu23 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 124px;
        right: 8px;
}
#menu3 {
        background-color: #00A3FF;
        background-image: url(../img/com.jpg);
        position: absolute;
        height: 15px;
        width: 158px;
        top: 150px;
        right: 6px;
}
#menu31 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 170px;
        right: 8px;
}
#menu32 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 188px;
        right: 8px;
}
#menu33 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 206px;
        right: 8px;
}
#menu4 {
        background-color: #00A3FF;
        background-image: url(../img/team.jpg);
        position: absolute;
        height: 15px;
        width: 158px;
        top: 231px;
        right: 6px;
}
#menu41 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 251px;
        right: 8px;
}
#menu42 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 269px;
        right: 8px;
}
#menu43 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 287px;
        right: 8px;
}
#menu5 {
        background-color: #00A3FF;
        background-image: url(../img/autres.jpg);
        position: absolute;
        height: 15px;
        width: 158px;
        top: 311px;
        right: 6px;
}
#menu51 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 331px;
        right: 8px;
}
#menu52 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 349px;
        right: 8px;
}
#menu53 {
        background-color: #00A3FF;
        background-image: url(../img/liside.jpg);
        position: absolute;
        height: 14px;
        width: 156px;
        top: 367px;
        right: 8px;
}
#menu6 {
        background-color: #00A3FF;
        background-image: url(../img/partenaires.jpg);
        position: absolute;
        height: 15px;
        width: 158px;
        top: 391px;
        right: 6px;
}
#menu61 {
        background-color: #00A3FF;
        position: absolute;
        height: 447px;
        width: 156px;
        top: 430px;
        right: 6px;
}
#menu611 {
        background-color: #00A3FF;
        position: absolute;
        height: 40px;
        width: 156px;
        top: 1px;
        right: 1px;
}
#menu612 {
        background-color: #00A3FF;
        position: absolute;
        height: 40px;
        width: 156px;
        top: 41px;
        right: 1px;
}
#menu613 {
        background-color: #00A3FF;
        position: absolute;
        height: 40px;
        width: 156px;
        top: 81px;
        right: 1px;
}
#menu614 {
        background-color: #00A3FF;
        position: absolute;
        height: 40px;
        width: 156px;
        top: 121px;
        right: 1px;
}
#rightmenu {
        background-color: #0EA8FE;
        background-image: url(../img/menudroit.jpg);
        position: absolute;
        height: 949px;
        width: 32px;
        right: 0px;
        bottom: 0px;
}
#link1 {
        position: absolute;
        height: 144px;
        width: 28px;
        left: 0px;
        top: 36px;
}
#mainbas {
        background-color: #0FA9FF;
        background-image: url(../img/footer.jpg);
        position: absolute;
        height: 95px;
        width: 868px;
        left: 0px;
        bottom: 0px;
}
#message {
        position: absolute;
        height: 48px;
        width: 621px;
        left: 32px;
        top: 15px;
}
/* Class Defs */
.message {
        font-family: Arial, Helvetica, Times, serif;
        font-size: 12px;
        color: #000000;
        text-align: center;
        text-decoration:none;
        vertical-align: middle;
        font-weight: bold;
}
.message2 {
    font-family: Arial, Helvetica,;
        font-size: 12px;
        color: #000000;
        text-align: center;
        text-decoration:none;
        vertical-align: middle;
       
}
.menu {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        font-weight: bold;
        padding-left: 8px;
        color: #000000;
        text-decoration: none;
}


ich danke alle dennen die mir versuchen zu helfen.

cgdesign 23.04.2008 12:11
Du positionierst ja alles und dann noch mit absoluter Höhe...

carlos587261 23.04.2008 13:50
Ja aber hab dass schon gewächselt aber dann sind meine div alle einen auf dem anderen.

hubspe 23.04.2008 14:07
Hi,

dein Quelltext enthält auch noch einige Fehler, z.B. darfst du kein div in ein a reinschreiben, weil a ein Inline-Element ist.

Wenn das alles dynamisch je nach Textmenge wachsen soll mußt du height rausschmeissen.

Weißt du denn was position:absolut/relativ, usw. genau macht und was das für Auswirkungen auf dein Layout hat?

I.d.R. braucht man das nämlich nicht, es ist sogar meistens kontraproduktiv.

Gruß
Klaus


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:59 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023