tekst in footer: probleem

[Mitsie007]

Hallo,

Ik ben bezig met de layout van een website, maar hij wil nog niet helemaal wat ik wil. Ik wil graag een footer. Eentje die sticky en liquid is. Nu is dat redelijk gelukt, op de tekst na. Wanneer ik het scherm verklein of ik zet mijn resolutie op '600 X 800', dan valt de tekst buiten mijn footer.

Kan iemand mij hierbij helpen? Is het mogelijk mijn tekst ook liquid te maken?

Dit is de website waarmee ik bezig ben :

http://www.myrtheroos.nl/EW_ter_Meer/

en dit is de bijbehorende css (beetje een rommeltje nog hoor)

/*Standaard waarde van margin en padding*/
html, body{
	height:100%;
}

body {
	margin: 0;
	padding: 0;
	color:#FFFFFF;
	height:100%;
	width:100%;
	top:0;
	left:0;
	font-size:100%; 
}

#bg_image{
	position: fixed;
	width: 100%;
	height:100%;
	top: 0;
	bottom:0;
	z-index: -3;
	border: 0;
}

#left{
	position:fixed;
	width:20%;
	left:0%;
}
#center{
	position:fixed;
	width:60%;
	height:95%;
	left:20%;
	z-index:-3;
}
#right{
	position:fixed;
	width:20%;
	right:0%;
}

#center_veld{
	position:fixed;
	width:60%;
	height:98%;
	top:1%;
	bottom:-1%;
	z-index:-3;
}

#menu_balk{
	position:relative;
	width:70%;
	height:14%;
	top:4%;
	left:7%;
	z-index:0;
}

#text_veld{
	position:relative;
	width:76%;
	height:70%;
	top:13%;
	left:20%;
	z-index:-1;
}

*/ !!  -  Hier gaat het om */

#footer{
	position:absolute;
	width:100%;
	height:5%;
	right:0%;
	bottom:0%;
	z-index:0;
	clear: both;
}
#footer_tekst a{
 	text-decoration: none;
	font-family:Book Antiqua, Georgia, Verdana;
	color: #FFFFFF; 
}
	
#footer_tekst a:hover{
	font-weight:bold;
	font-size:110%; 
}
#footer_tekst{
	position:fixed;
	font-size:70%;
	bottom:0%;
	right:1%; 
}
#footer_balk{
	position:fixed;
	width:100%;
	height:5.5%;
	bottom:0%;
	left:0%;
	/* z-index: -1;  */
}

Alvast bedankt!

 

[Verwijderd lid 141197]

ten eerste er valt ongeveer 2% van alle internet gebruikers in de groep 800x600 of lager

dus je moet bedenken of jouw doel groep in deze 2% valt(oude computers voornamelijk), als dit niet het geval is bouw dan je site voor 1024x768(ongeveer 75% van de internet gebruikers)

verder over het probleem zelf:

oplossing 1:

met javascript kijken wat de resolutie is en het bijbehorende css file aan roepen

[JS]
if (window.screen.heigth <= 500) {
// laad het ander css file
}

[/JS]

oplossing 2:

de footer een min-heigth geven zodat de content er altijd in past

#footer{
	min-height: 50px /* ofzo
	position:absolute;
	width:100%;
	height:5%;
	right:0%;
	bottom:0%;
	z-index:0;
	clear: both;
}

 

[Mitsie007]

Och ja, natuurlijk. Je laatste oplossing is voor mij een hele goede! Dat was ik ook alweer helemaal vergeten

Dankjewel! Ik kan weer verder.


Groet, Mitsie