zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden DIV Länge automatisch anpassen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 08.05.2006, 13:49
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 29.03.2005
Beiträge: 51
judicious befindet sich auf einem aufstrebenden Ast
Standard DIV Länge automatisch anpassen

Guten Tag

Ich habe zwei kleine Probleme die mir wirklich Kopfschmerzen bereiten.

Im Anhang ist das Index und die CSS, damit ich hier nicht den ganzen Code posten muss

Nun zu meinem Problem. Wie man in der Grafik sieht, möchte ich wissen wie man die beiden DIVs auf 100% strecken kann. Ich habe mir alles bekannte bereits probiert doch nichts führt zum Erfolg. Und das zweite ist der Footer. Wieso wird der im FF so komisch angezeigt. Die Grafik vom Footer ist irgend wo im Content Bereich.



Vielen Dank schon im Voraus

Mit freundlichen Grüssen
judicious
Angehängte Dateien
Dateityp: zip hostblock.ch.zip (2,6 KB, 1x aufgerufen)
__________________
Website:Kontrastlos.ch mein Portfolio
http://suisseblog.ch/suisseblog.gif
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 08.05.2006, 14:30
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.930
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Suche nach "faux columns" ...
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 08.05.2006, 15:22
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 29.03.2005
Beiträge: 51
judicious befindet sich auf einem aufstrebenden Ast
Standard

Die bringen mir nix. Ich weiss echt nicht an was das liegt.



Das weiss grüne habe ich als Hintergrund definiert für die rote Box. Im langem div also in dem mit mehr inhalt wird der BG auch angezeigt aber links wird einfach nur noch die hälfte des hintergrunds angezeigt.
__________________
Website:Kontrastlos.ch mein Portfolio
http://suisseblog.ch/suisseblog.gif
Mit Zitat antworten
  #4 (permalink)  
Alt 08.05.2006, 15:32
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.930
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Dann hast du es falsch implementiert. Wie sieht denn dein Code dazu aus?
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
  #5 (permalink)  
Alt 08.05.2006, 15:43
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 29.03.2005
Beiträge: 51
judicious befindet sich auf einem aufstrebenden Ast
Standard

Die beiden Files sind im Anhang. Jetzt funktioniert es im FF aber nicht mehr im IE

Angehängte Dateien
Dateityp: zip hostblock.ch_603.zip (2,7 KB, 1x aufgerufen)
__________________
Website:Kontrastlos.ch mein Portfolio
http://suisseblog.ch/suisseblog.gif
Mit Zitat antworten
  #6 (permalink)  
Alt 08.05.2006, 15:53
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.930
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Meinst du, hier hat jemand Lust, erstmal deine Datei herunter zu laden, zu entpacken und dann zu entwursteln?

Schreib dein CSS und HTML hier rein oder stell es online.
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
  #7 (permalink)  
Alt 08.05.2006, 15:56
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 29.03.2005
Beiträge: 51
judicious befindet sich auf einem aufstrebenden Ast
Standard

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
    <head>
        <title>
         HOSTBLOCK | Solid As A Rock ::: MULTIPLE DOMAIN Hosting ::: Reseller Plans
        </title>

		<!--
			Dieser Source Code ist von Kontrastlos.ch
		       	\\|//
				 - -
		       C(o o)D
			      ~
		      -o0o-o0o-
		-->

        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <meta http-equiv="content-language" content="de,at" />
        <meta http-equiv="expires" content="0" />
        <meta http-equiv="pragma" content="no-cache" />
        <meta http-equiv="imagetoolbar" content="no" />

        <meta http-equiv="Reply-to" content="info@hostblock.ch" />
        <meta name="author" content="hostblock.ch" />
        <meta name="description" content="HOSTBLOCK | Solid As A Rock | Superb Multiple Domain Hosting" />
        <meta name="generator" content="Bluefish" />
        <meta name="keywords" content=
        "hosting, hostblock, hostblock.ch, reseller, reseller-plan, host, web, provider, isp, internet, virtual, server, shared, dedicated, administration, firewall, backup, unix, red hat, linux, support, domain, registration, pointing, pointer, program, provision, reseller, subdomain, webspace, space, speicherplatz, ftp, cgi, perl, script, ssi, ssl, frontpage, php, php 4, flash, shockwave, mysql, database, datenbank, statische ip-adresse, ip, support, statistiken, webalizer, stats, pop3, smtp, e-mail, mail, webmail, forwarder, autoresponder, gnstig, e-commerce, commerce, shop, multiople domain hosting, multiple-domain, multi-domain, visitenkarten" />
        <meta name="robots" content="index,follow" />
        <meta name="copyright" content="Copyright (c) hostblock.ch" />
        <meta name="rating" content="general" />
        <meta name="language" content="swiss" />

      	<link href="favicon.ico" rel="shortcut icon" />
      	<link href="css2.css" rel="stylesheet" type="text/css" />

		<!--[if IE]>
        <style type="text/css" media="screen">
        #site{
        height: 100%;
        border: 1px solid #C3C3B7;
        }
        #sidebar{
        height: 100%;
        }
        </style>
        <![endif]-->

   	</head>

   	<body>

   	<div id="site">

		<div id="head"></div>

		<div id="menu">

			[img]http://www.hostblock.ch/images/home.gif[/img]
			[img]http://www.hostblock.ch/images/hosting.gif[/img]
            [img]http://www.hostblock.ch/images/products.gif[/img]
            [img]http://www.hostblock.ch/images/support.gif[/img]
            [img]http://www.hostblock.ch/images/contact.gif[/img]

		</div>

		<div id="banner"></div>

		<div id="submenu">

			submenu

		</div>

		<div id="main">

				<div id="sidebar">

					<div id="newsborder">

						<div id="news">

							  


                              	Headlines by Newsfactor

                                	
                                    <script type="text/javascript" src="http://www.freenewsfeed.com/headlines/?javasc=1&amp;basic_blue=1" ></script>
                                    

                                    Newsfactor News


                                </p>
                                


								[img]http://sfx-images.mozilla.org/affiliates/Buttons/88x31/get.gif[/img]

						</div>

					</div>

				</div>

				<div id="content">

				Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 
Content 


				</div>

			</div>

        <div id="footer">

            2006 HOSTBLOCK.CH

        </div>


	</div>

   	</body>
</html>


Code:
html{
  height: 100%;
}

html, body { margin:0; padding:0; height:100%; }

body{
    padding:0px;
    margin:0px;
    height: 100%;
    background: #E8E8E8 url('images/sitebg.gif') repeat-y;
    background-position: left;
    color: #2b2b2b;
    font-family: Tahoma, Arial, Sans-serif;
    font-size: 12px;
    line-height: 140%;
}

#site{
    background: #F4F4F4;
    width: 779px;
    height: 100% auto;
}

#main{
	background: #F4F4F4;
    width: 778px;
    height: 100%;
}

#head{
    background: #FFF url('http://hostblock.ch/images/headerlogo.gif') no-repeat;
    width: 779px;
    height: 75px;
}

#menu{
    background: #FFF url('http://hostblock.ch/images/nav_bg.gif') repeat-x;
    width: 780px;
    height: 25px;
    text-align: right;
}

#banner{
    background: #FFF url('images/banner.jpg') no-repeat;
    background-position: bottom left;
    width: 779px;
    height: 188px;
}

#submenu{
    background: #FFF url('images/submenu.jpg') no-repeat;
    width: 779px;
    height: 44px;
}

#sidebar{
    float: left;
    background: #E8E8E8;
    width: 243px;
    height: 100%;
    margin: 0px;
}

#newsborder{
    background: #FFF;
    border: 1px #CCC solid;
    width: 204px;
    margin: 19px;
    margin-top: 25px;
    height: auto;
}

#news{
    background: #F4F4F4;
    width: 168px;
    padding-left: 11px;
    padding-right: 11px;
    padding-top: 15px;
    padding-bottom: 15px;
    border: 7px #FFF solid;
    height: auto;
}

#content{
    background: #F4F4F4;
    width: 532px;
    padding: 1px;
    height: 100%;
    float:left;
}



#footer{
    background: #FFF url('http://hostblock.ch/images/footer_bg.gif') repeat-x;
    width: 780px;
    height: 38px;
    border-top: 1px solid #B9B9BE;
    font-family: Verdana, Times New Roman, Georgia, Trebuchet Ms,Serif;
    color: #999;
    font-size: 0.8em;
    text-align: center;
}



a:active{ color: #015B8D; text-decoration: none; }
a:link{ color: #015B8D; text-decoration: none; }
a:visited{ color: #015B8D; text-decoration: none; }
a:hover{ color: #015B8D; text-decoration: none; }

img {
	border: 0px;
}

h3{
    color: #AE1510;
    font-family: Times New Roman, Georgia, Trebuchet Ms,Serif;
    font-size: 1.6em;
    font-weight: lighter;
    margin-bottom: 10px;
}

h4{
    color: #AE1510;
    font-family: Trebuchet Ms,Serif;
    font-size: 1em;
    margin-bottom: 0;
}

h5{
    color: #333333;
    font-family: Trebuchet Ms,Serif;
    font-size: 1em;
    margin-bottom: 0;
}

#menu a:active{ color: #797979; text-decoration: none; }
#menu a:link{ color: #797979; text-decoration: none; }
#menu a:visited{ color: #797979; text-decoration: none; }
#menu a:hover{ color: #525252; text-decoration: none; }

#menu ul{
    border: 0px;
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    text-align: center;
}

#menu ul li{
    display: block;
    margin: 0px;
    text-align: center;
}

#menu ul li a{
    border-bottom: 1px solid #B9B9BE;
    display: block;
    vertical-align: middle;
    height: 21px;
    margin: 0px;
    padding-top: 4.5px;
    padding-left: 24px;
    text-align: left;
    width: 240px;
}

#productshome{
    background-repeat: no-repeat;
    height: 280px ;
    margin: auto;
    border-top: 1px solid #EAEAEA;
    border-bottom: 1px solid #EAEAEA;
    padding-top: -0px;
    padding-bottom: 20px;
    width: 99%;
}
__________________
Website:Kontrastlos.ch mein Portfolio
http://suisseblog.ch/suisseblog.gif
Mit Zitat antworten
  #8 (permalink)  
Alt 08.05.2006, 15:59
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.930
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Soweit ich das erkennen kann, gehört das zu kachelnde Hintergrundbild (mit denen du zwei gleich hohe Spalten "simulierst") in das div #site hinein.

Und du solltest alle height: 100% gegen min-height: 100% austauschen - das ist die korrekte Variante für alle "braven" Browser.

Für den IE allein musst du height benutzen, da er kein min-height kennt, es aber so interpretiert (was falsch ist, aber naja ... IE halt).
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
  #9 (permalink)  
Alt 08.05.2006, 16:16
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 29.03.2005
Beiträge: 51
judicious befindet sich auf einem aufstrebenden Ast
Standard

ich habe es jetzt einfach mal in main und body gedrückt. so funktioniert es auch. Was jetzt noch bleibt ist der Footer der im FF vollkommen falsch angezeigt wird. ? Wieso auch immer.

Die heights werde ich noch ersetzen, danke für den Hinweis
__________________
Website:Kontrastlos.ch mein Portfolio
http://suisseblog.ch/suisseblog.gif
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 08.05.2006, 16:28
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.930
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Definiere mal "vollkommen falsch" ... wie soll es aussehen, wie nicht? Sofern du den footer im übrigen nicht absolut positionierst, wird es eh Probleme geben wegen deinen height: 100% - durch diese Angabe brauchen deine Spalten bereits die volle Höhe, für den footer wäre kein Platz mehr.
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Fragen zu CSS und Joomla DOKTOR CSS 2 23.05.2011 19:29
Brauche Hilfe: Schwarzes Nichts Zwox CSS 10 19.11.2010 16:53
Header entfernen tripple CSS 17 15.06.2010 15:41
Schriftfarbe in den Eintragungsfeldern von jforms Steveislucky CSS 2 16.03.2010 10:59
CSS Text nebeinander? carstiee09 CSS 13 13.11.2009 19:18


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:35 Uhr.