Afgesneden afbeelding op Ipad

[_Moe_]

Ik ben bezig met een webpagina waar gewoon 1 enkele afbeelding opstaat.

afmetingen afbeelding: 1000x768

code:

<div id="container">
    <img src="test.jpg" />
</div>

Op mijn computer wordt de afbeelding mooi weergegeven, ook op de ipad wordt deze mooi weergegeven als je de afbeelding rechtop houdt. Maar van zodra je de ipad 90° draait word de onderkant van de afbeelding gewoon afgesneden en kan ik ook niet naar beneden scrollen.

Waar kan dit aan liggen?

[MrBrown]

Misschien dmv van een css media query de afbeelding in landscape mode verkleinen?

[ Voor 9% gewijzigd door MrBrown op 09-04-2013 14:05 ]

[RobIII]

Geen iPad bij de hand, maar ligt 't niet gewoon aan de CSS die van toepassing is op #container? Iets met overflow:hidden ofzo? Post alle (relevante!) CSS eens? Werkt 't wel na een refresh? Werkt 't wel als je enkel-en-alleen een image laadt (zonder HTML dus, gewoon recht naar http://foo.bar.com/test.jpg surfen).

[ Voor 32% gewijzigd door RobIII op 09-04-2013 14:05 ]

[Bioman]

Wat gebeurd er als je iets meer informatie meegeeft in de html?

HTML:

<div id="container">
    <img src="test.jpg" alt="Test Afbeelding" height="768" width="1000">
</div>

Edit @ MrBrown, bedoelde het als een snel testje, niet als productiecode

[ Voor 33% gewijzigd door Bioman op 09-04-2013 14:19 ]

[MrBrown]

Bioman schreef op dinsdag 09 april 2013 @ 14:05:

HTML:

<div id="container">
    <img src="test.jpg" alt="Test Afbeelding" height="768" width="1000">
</div>

Wat gebeurd er als je iets meer informatie meegeeft in de html?

Maten in de html. Niet doen, lekker aan css overlaten.

Overigens moet het inderdaad iets met een overflow te maken hebben. Ik ging er even vanuit dat je de hele image op het scherm wilde hebben.

[ Voor 17% gewijzigd door MrBrown op 09-04-2013 14:07 ]

[_Moe_]

- Maten aan de img tag geven werkt niet
- container tag heeft als enige css 'margin: 0 auto 0 auto;'
- media query zou ervoor zorgen dat de afbeelding verkleind wordt weergegeven en dat is niet direct de bedoeling, het maakt niet uit dat er gescrold moet worden.

[TheNephilim]

margin: 0 auto; is al genoeg. Echter moet je dan een breedte opgeven, anders gaat de container niet in het midden staan.

Wat betreft je probleem, weet je zeker dat je #container niet ergens position: absolute; heeft staan?

[NiteSpeed]

MrBrown schreef op dinsdag 09 april 2013 @ 14:06:
[...]

Maten in de html. Niet doen, lekker aan css overlaten.

Maten in de HTML absoluut wel doen. Zorgt ervoor dat browser al ruimte reserveren voor je image voordat de CSS bekend is.