background in linker onderhoek

Status
Niet open voor verdere reacties.

jorants

Gebruiker
Lid geworden
22 mei 2006
Berichten
105
hoi allemaal,

ik zit met het volgende probleem:
ik maak een website waar je op de index pagina een iframe heb met daarin de daadwerkelijke site.
daardoor ontstaat er een standaard rand met een achtergrond rond de site.
deze pagina scrolled dus niet.
nu wil ik de achtergrond van de index zo maken dat hij in de linker onder hoek staat.
op zich geen probleem, alleen kan de afbeelding niet meet naar beneden dan de laagste inhoud en ik wil hem echt in de hoek hebben, de laagste inhoud loop alleen nooit presies tot beneden, en dat verschilt per resolutie.

ik heb nu dit:
HTML:
<html>
<head>
<title>title</title>
<style type="text/css">
iframe {
overflow-x: hidden;
overflow-y: scroll;
scrollbar-3dlight-color:#ffd700;
scrollbar-arrow-color:#ff0;
scrollbar-base-color:#ff6347;
scrollbar-darkshadow-color:#ffa500;
scrollbar-face-color:#008080;
scrollbar-highlight-color:#ff69b4;
scrollbar-shadow-color:#f0f
}
body {overflow: hidden;
background-image:url('boom.png');
background-repeat:no-repeat;
background-attachment:scroll;
background-position:0% 100%;}

</style> 
</head>
<BODY> 

<center>
<img src="banner.jpg"><br>
<iframe name="page" WIDTH="50%" FRAMEBORDER="0" height="70%" SRC="home.html"> </iframe>
</center>
</BODY>

</html>

hoe kan ik dit zo krijgen dat de afbeelding boom.png ook daatwerklijk helemaal onderaan staat?

hopelijk was het een beetje te volgen (a)

tanx, joran
 
Nou, je probleem snap ik niet, maar goed.

Hier mijn test:
Code:
 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>title</title>
<meta http-equiv=content-type content="text/html; charset=windows-1252">
<style type="text/css">
iframe {
overflow-x: hidden;
overflow-y: scroll;
scrollbar-3dlight-color:#ffd700;
scrollbar-arrow-color:#ff0;
scrollbar-base-color:#ff6347;
scrollbar-darkshadow-color:#ffa500;
scrollbar-face-color:#008080;
scrollbar-highlight-color:#ff69b4;
scrollbar-shadow-color:#f0f
}
body {
background-image:url('../homepages/dier/images/oog.jpg');
background-repeat:no-repeat;
background-attachment:scroll;
background-position:0% 100%;
margin: 0;
padding: 0;
}
 
</style> 
</head>
<BODY> 
 
<center>
<img src="../homepages/dier/images/header.jpg" width="400" height="105" alt=""><br>

<iframe name="page" style="width:50%; height:400px; border: 2px solid #ff0000;"  SRC="bag.html"></iframe>


</center>
</BODY>
 
</html>

Ik heb een doctype toegevoegd en
margin: 0;
padding: 0;

Overigens krijg ik voor:
overflow-x: hidden;
overflow-y: scroll;
geen goedkeuring:
http://jigsaw.w3.org/css-validator/
en html:
http://validator.w3.org/

:cool:
 
Als je valideert op css3 worden overflow-x en overflow-y inmiddels wel geaccepteerd. Dat zit ook al zolang in browsers dat dat niet meer gaat veranderen.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan