ErikBooy007
Terugkerende gebruiker
- Lid geworden
- 24 mei 2007
- Berichten
- 3.814
Goedemiddag!
Ik vraag me af of het mogelijk is om een afbeelding op een pagina te centreren bij het afdrukken. Ik heb een afbeelding:
http://www.erikbooy.nl/SAA/cg.php?t...moment=48370.5&zfm_mass=1351&zfm_moment=45714
De pagina waar het om gaat staat (statisch, het daadwerkelijke verhaal is dynamisch) op http://www.erikbooy.nl/SAA/test_pagina.html .
Die wil ik dus graag in het midden van de pagina printen. Dat lukt niet. Het probleem is (o.a.) dat het niet de enige content van de pagina is. Ik heb al wel een page-break weten te forceren (niet eens per sé nodig, aangezien de rest van de content is gemaakt om precies één pagina te vullen) en ik kan de afbeelding ook in horizontaal in het midden krijgen. Alleen verticaal niet.
Dit is m'n print.css tot nu toe:
Overigens weet ik de exacte afmetingen van de afbeelding, die zijn constant.
Normaal gesproken als ik iets zowel horizontaal als verticaal wilde centreren, dan deed ik dat op de volgende manier:
Waarbij de parent absolute, relative of fixed is. Maar daarvoor heb ik dus nodig dat mn div.fullscreen in dit geval 100% van de hoogte van een pagina inneemt...
I'm lost...
Het is een nogal onsamenhangend verhaal geworden, maar hopelijk begrijpen jullie wat ik bedoel en kunnen jullie me helpen.
Ik vraag me af of het mogelijk is om een afbeelding op een pagina te centreren bij het afdrukken. Ik heb een afbeelding:
http://www.erikbooy.nl/SAA/cg.php?t...moment=48370.5&zfm_mass=1351&zfm_moment=45714
De pagina waar het om gaat staat (statisch, het daadwerkelijke verhaal is dynamisch) op http://www.erikbooy.nl/SAA/test_pagina.html .
Die wil ik dus graag in het midden van de pagina printen. Dat lukt niet. Het probleem is (o.a.) dat het niet de enige content van de pagina is. Ik heb al wel een page-break weten te forceren (niet eens per sé nodig, aangezien de rest van de content is gemaakt om precies één pagina te vullen) en ik kan de afbeelding ook in horizontaal in het midden krijgen. Alleen verticaal niet.
Dit is m'n print.css tot nu toe:
Code:
body {
width: 100%;
}
@media print {
div.fullscreen {
page-break-before: always;
height: 100%;
width: 100%;
position: relative;
}
img.centered {
display: block;
position: absolute;
top: 50%;
left: 50%;
margin-left: -204px;
}
}
Overigens weet ik de exacte afmetingen van de afbeelding, die zijn constant.
Normaal gesproken als ik iets zowel horizontaal als verticaal wilde centreren, dan deed ik dat op de volgende manier:
Code:
element {
position: absolute;
top: 50%;
left: 50%;
margin-left: -204px; /* De helft van de breedte van het element */
margin-top: -300px; /* De helft van de hoogte van het element */
}
Waarbij de parent absolute, relative of fixed is. Maar daarvoor heb ik dus nodig dat mn div.fullscreen in dit geval 100% van de hoogte van een pagina inneemt...
I'm lost...
Het is een nogal onsamenhangend verhaal geworden, maar hopelijk begrijpen jullie wat ik bedoel en kunnen jullie me helpen.
Laatst bewerkt: