Thread: iframe centreren
-
12-12-2011, 18:37 #1Member
- Registered
- 18/07/02
- Location
- Antwerpen
- Posts
- 2,481
- iTrader
- 2 (100%)
- Mentioned
- 0 Post(s)
- Reputation
- 5/12
iframe centreren
Hello,
Ben nu toch al wel een tijdje met iets aan het knoeien maar heb de indruk dat ik er bijna ben...
Ik probeer een iframe volledig te centreren in een pagina.
In het begin kreeg ik hem enkel horizontaal gecentreerd (ik heb echt niet zoveel verstand van websites bouwen) maar nu ik hem eindelijk verticaal gecentreerd heb weet ik niet meer hoe ik hem ook horizontaal kan centreren.
het gaat over de volgende page: Upload Form
en hier is mijn code:
Wat ik ook niet begrijp is dat wanneer de pagina schermvullend is, er nog steeds rechts een scrolbalk te zien is...Code:<html> <head> <title>Upload Form</title> <style type="text/css"> body, html {height: 100%;} #outer {height: 100%; overflow: hidden;} #outer[id] {display: table; position: static;} #middle {width: 100%; text-align: center;} #middle[id] {display: table-cell; vertical-align: middle; width: 100%;} #inner {width: 370px; margin-left: auto; margin-right: auto;} #inner[id] {position: static;} body { background-image:url('background 9.png'); background-repeat:repeat; background-position:inherit; } </style> </head> <body> <div id="outer"> <div id="middle"> <div id="inner"> <iframe src='/contact/contactform.php' frameborder='0' width='370' height='360' allowtransparency='true'></iframe> </div> </div> </div> </body> </html>
Merci voor de aandacht en hopelijk kan iemand mij helpen!no votes
-
-
12-12-2011, 18:48 #2Deactivated user
- Registered
- 14/08/10
- Location
- Diest
- Posts
- 2,419
- iTrader
- 1 (100%)
- Mentioned
- 0 Post(s)
- Reputation
- 8/16
Waarom zijn die inner, middle en outer divs nodig? Eentje is al meer dan voldoende voor wat jij wilt doen?
HTML Code:<html> <head> <title>Upload Form</title> <style type="text/css"> body, html { height: 100%; width: 100%; margin: 0; } body { background-color: #f5f5f5; } iframe#form { width: 370px; height: 360px; position: absolute; top: 50%; left: 50%; margin-top: -180px; margin-left: -185px; } </style> </head> <body> <iframe id="form" src='contact.php' frameborder='0' allowtransparency='true'></iframe> </body> </html>
Last edited by -BVR-; 12-12-2011 at 19:04.
no votes
-
12-12-2011, 19:29 #3Member
- Registered
- 18/07/02
- Location
- Antwerpen
- Posts
- 2,481
- iTrader
- 2 (100%)
- Mentioned
- 0 Post(s)
- Reputation
- 5/12
Had het via deze tutorial gedaan: Vertical Centering in CSS
Het werk!
Muchas grasias!
*lockLast edited by eddie; 12-12-2011 at 20:41.
no votes
