Zurück   Flashforum > Alternative Technologien > HTML und CSS

Antwort
 
LinkBack Themen-Optionen Ansicht
Alt 27-02-2010, 14:04   #1 (permalink)
Neuer User
 
Registriert seit: Jul 2003
Beiträge: 1.229
CSS height: 100%-10px; ?

Kennt jemand einen Hack, wie man die Höhe eines Elements wie im Thread Titel angegeben mit einer Kombination aus % und px angeben kann? Google hat mir bisher nicht die Lösung geliefert.

Das Element hat den Wert overflow-y: scroll, die Scrollbar muß der Höhe des Elementes entsprechen (tut sie normalerweise auch, aber deshalb kann ich die 10px z.B. nicht über den Innenabstand abziehen, weil dann die Scrollbar immer noch 100% hoch ist).

Und ich brauche das für den IE6. Danke!
__________________
EDV = Ende Der Vernunft
hmpf ist offline   Mit Zitat antworten
Alt 27-02-2010, 14:34   #2 (permalink)
Neuer User
 
Benutzerbild von :: RK ::
 
Registriert seit: Jan 2002
Beiträge: 5.445
Zitat:
Zitat von hmpf Beitrag anzeigen
Und ich brauche das für den IE6. Danke!
Vergiss es

Kannst du mal n Screenshot anhängen, hab nicht 100%ig verstanden was du
mit der Scrollbar gemeint hast

Ich bezweifle aber jetzt schon, dass es mit CSS alleine geht.
__________________
Das Glück im Leben hängt von den guten Gedanken ab, die man hat.

Easing_Equations / Flash Kontaktformular / FlashPlugin W3C konform / Nützliche Beiträge zu FAQs
:: RK :: ist offline   Mit Zitat antworten
Alt 27-02-2010, 14:54   #3 (permalink)
Neuer User
 
Registriert seit: Jul 2003
Beiträge: 1.229
Also ich brauche das für den IE6, weil das ganze schon einen Notlösung für den IE6 ist. Das normale Layout funktioniert in dem ******browser nämlich nicht. So komme ich dem bisher am nächsten.
In dem Screenshot ist das Element mit der Scrollbar auf height: 100%, wie man sieht, würde ich von den 100% gerne die Höhe des Footers abziehen.
Angehängte Grafiken
Dateityp: jpg msie6scrollbar.jpg (17,4 KB, 16x aufgerufen)
__________________
EDV = Ende Der Vernunft
hmpf ist offline   Mit Zitat antworten
Alt 27-02-2010, 15:38   #4 (permalink)
Neuer User
 
Registriert seit: Jul 2003
Beiträge: 1.229
Nächste Idee:

Ich packe das div nochmal in ein anderes div, das mit height:100% (also so wie im Screenshot) aber das bekommt unten noch einen Innenabstand von 10px. Müssten dann nicht für das innere div 100% dieselbe Höhe sein, wie 100%-10px für das äußere?
Dachte ich jedenfalls, scheint auch nicht zu funktionieren
__________________
EDV = Ende Der Vernunft
hmpf ist offline   Mit Zitat antworten
Alt 27-02-2010, 16:24   #5 (permalink)
Neuer User
 
Benutzerbild von :: RK ::
 
Registriert seit: Jan 2002
Beiträge: 5.445
Zitat:
Zitat von hmpf Beitrag anzeigen
Nächste Idee:

Ich packe das div nochmal in ein anderes div, das mit height:100% (also so wie im Screenshot) aber das bekommt unten noch einen Innenabstand von 10px. Müssten dann nicht für das innere div 100% dieselbe Höhe sein, wie 100%-10px für das äußere?
Dachte ich jedenfalls, scheint auch nicht zu funktionieren
Innenabstand (padding) wird immer dazuaddiert. Beispiel:
Code:
div {
  height: 100px;
  width: 100px;
  padding: 10px;
}
Das DIV ist dann 120px hoch und 120px breit.

Wieso verschwindet der Container hinter dem Footer überhaupt?

Vielleicht kommst du auch um JS nicht herum. Aber soviel Aufwand für den IE6?
Schau mal ob du dein HTML und CSS nicht doch noch optimieren kannst.
__________________
Das Glück im Leben hängt von den guten Gedanken ab, die man hat.

Easing_Equations / Flash Kontaktformular / FlashPlugin W3C konform / Nützliche Beiträge zu FAQs

Geändert von :: RK :: (27-02-2010 um 16:27 Uhr)
:: RK :: ist offline   Mit Zitat antworten
Alt 27-02-2010, 17:19   #6 (permalink)
Neuer User
 
Registriert seit: Jul 2003
Beiträge: 1.229
Natürlich habe ich schon rumprobiert, ob ich das irgendwie anders optimieren kann. Das Layout ist dreispaltig, wobei aber nur die mittlere Spalte scrollen soll. Deshalb liegt die im Hintergrund. Der Footer geht über alle drei Spalten und soll natürlich immer am unteren Bildrand stehen.

Bis jetzt ist das mein ganzer zusätzlicher Code nur für den IE6:

Code:
<!--[if IE 6]>
<style type="text/css">@import url(/css/ie6.css);</style>
<![endif]-->
<div id="ie6margin">
</div>
#main{
	position:absolute;	
}
#navigation ul li, ul.subNavigation li, ul.navigation li{
	zoom: 1;
}
#ie6margin{
	height:100%;
	display: block;
	position:absolute;
	left: 50%;
	width: 490px;
	margin-left: -245px;
	padding-bottom: 40px;
	text-align: left;
}
#content {
	display: block;
	position:static;
	left: 0px;
	margin-left: 0px;
	height:100%;	
	padding-bottom: 0px;
	overflow-y: scroll;
}
Soviel Aufwand war das bisher nicht.
Hm... vielleicht muß ich nur das mit dem Footer etwas anders lösen. Ich probiere es mal.
__________________
EDV = Ende Der Vernunft
hmpf ist offline   Mit Zitat antworten
Alt 27-02-2010, 17:43   #7 (permalink)
Wetmaster
 
Benutzerbild von Nicmare
 
Registriert seit: Aug 2001
Ort: BERLIN
Beiträge: 3.070
dein problemchen habe ich damals mit jquery gelöst. ansonsten kannst du es ja mal mit nem sticky-footer probieren?
__________________
Dropbox 250MB mehr für dich/mich
Dashcam-Test
Nicmare ist offline   Mit Zitat antworten
Alt 27-02-2010, 17:59   #8 (permalink)
Neuer User
 
Registriert seit: Jul 2003
Beiträge: 1.229
Der Stickyfooter funktioniert aber nicht wie erforderlich.

Code:
function kackBrowser(){
	window.onresize = onResize;
	onResize();
}

function onResize(){
	var c = document.getElementById('content');
	var winHeight = document.body.clientHeight;
	var footerHeight = 40;
	var h = winHeight-footerHeight;
	c.style.height = String(h)+'px';
}
Damit geht es jetzt. Jetzt sehen nur noch User mit IE6 und deaktiviertem Javascript das Layout nicht ganz richtig (hoffe ich, hab es noch nicht auf Mac getestet...). Damit sollte man leben können.
__________________
EDV = Ende Der Vernunft
hmpf ist offline   Mit Zitat antworten
Alt 10-03-2010, 14:20   #9 (permalink)
Taufrisch
 
Benutzerbild von Dennis
 
Registriert seit: Jun 2001
Ort: Berlin
Beiträge: 2.042
fix positionierte elemente am unteren bildschirmrand haben mir mit sicherheit 10 jahre meines kostbaren lebens geraubt ...
Dennis ist offline   Mit Zitat antworten
Antwort

Lesezeichen

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 sind an
Pingbacks sind an
Refbacks sind an


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
100% height Div - IE CHRIZZZLIE HTML und CSS 4 03-04-2007 16:01
height=100% bei Child-Element eines Parent's mit ebenfalls height=100% automatix HTML und CSS 1 10-12-2006 15:54
Schriftgröße kleiner 10px geht im Mozilla nicht Grafikdoktor HTML und CSS 10 23-10-2006 18:36
Tween immer um 10px nach rechts bewegen oconner ActionScript 1 4 21-06-2006 22:19
Line-Height im IE6 falk07 HTML und CSS 2 17-07-2005 15:11


Alle Zeitangaben in WEZ +1. Es ist jetzt 02:52 Uhr.

Domains, Webhosting & Vserver von Host Europe
Unterstützt das Flashforum!
Adobe User Group


Copyright ©1999 – 2014 Marc Thiele