Fout bij grote afbeelding op nieuwspagina.

Pagina: 1
Acties:

Acties:
  • 0 Henk 'm!

  • computerjunky
  • Registratie: Maart 2004
  • Laatst online: 22:06
In het artikel .Plan van vandaag verschuift de content om 1 of andere reden een derde van een pagina naar benden.

Afbeeldingslocatie: https://tweakers.net/i/i9Wgyr0SLPngwHAD2r8FrfOyPmI=/800x/filters:strip_exif()/f/image/rbRGQIgtAHdFY2SGwpbf8JPY.png?f=fotoalbum_large

Bij pagina's zonder die afbeeldingen is de pagina gewoon bovenin uitgelijnd. Het probleem lijkt in het Heroblock te zitten. Als ik die weg haal dan gaat de pagina weer omhoog maar te ver door het dan totaal ontbreken van het block schuift de inhoud naar de top onder de zoek balk.

Ik kan geen andere pagina's vinden met achtergrond afbeelding dus kan niet testen of het specifiek dit .plan item is of of een breder probleem.

Acties:
  • 0 Henk 'm!

  • Hahn
  • Registratie: Augustus 2001
  • Laatst online: 00:11
Dat is by design, omdat je browser-scherm heel breed is en de hero image meeschaalt. Gebeurt bij alle artikelen met een grote hero image: reviews: Betaalbare ruisonderdrukking - Negen draadloze hoofdtelefoons op een...

The devil is in the details.


Acties:
  • 0 Henk 'm!

  • computerjunky
  • Registratie: Maart 2004
  • Laatst online: 22:06
Hahn schreef op dinsdag 22 februari 2022 @ 17:31:
Dat is by design, omdat je browser-scherm heel breed is en de hero image meeschaalt. Gebeurt bij alle artikelen met een grote hero image: reviews: Betaalbare ruisonderdrukking - Negen draadloze hoofdtelefoons op een...
Ik vind het maar een raar design dan. Maar heb de lijn gevonden waar het om gaat en door het volgende te veranderen is het terug naar boven te plaatsen:

Afbeeldingslocatie: https://tweakers.net/i/Iws-rA-Zec20szGc7JQAnb3reHE=/800x/filters:strip_exif()/f/image/7kXz9X09j1pVMZX1c7vz56Ug.png?f=fotoalbum_large

De standaard waarde was -430 en met 850 is het weer 'normaal'. Weet nog niet of ik deze verandering permanent kan maken maar we gaan het zien.

Ik snap dat de Afbeelding mee schaalt maar ik zie niet in waarom de contentarera niet boven uitgelijnd is. Het zijn immers 2 losse elementen. De contentarea lijnt ook prima in het midden uit dus zou bovenin ook geen probleem moeten zijn.

Als ik overigens diee gehele lijn weg haal en er simpelwel "-460px" van maak dan schaalt de afbeelding gewoon nee maar blijft de uitlijning prima bovenin.

Afbeeldingslocatie: https://tweakers.net/i/SQDPA6S7RWKRlq8PeIl51EjN6YM=/800x/filters:strip_exif()/f/image/zSISrm1tRQ8GVuDcAwpyfLyv.png?f=fotoalbum_large

Afbeeldingslocatie: https://tweakers.net/i/i44XHv6AWBKwa5CKIZv9IL_3RxM=/800x/filters:strip_exif()/f/image/yFWQ71iDWyyYkH9lmNlnkWc0.png?f=fotoalbum_large

Ik denk dat er dus wel een code verbetering toe te passen is om die spacing te normaliseren.

Acties:
  • 0 Henk 'm!

  • Hahn
  • Registratie: Augustus 2001
  • Laatst online: 00:11
computerjunky schreef op dinsdag 22 februari 2022 @ 17:53:
[...]

Ik vind het maar een raar design dan.
Tja, ik heb het niet bedacht ;) En het lijkt me vooral bedacht voor schermen/windows die zo rond de 1280px (max 1920px) zitten.
De standaard waarde was -430 en met 850 is het weer 'normaal'. Weet nog niet of ik deze verandering permanent kan maken maar we gaan het zien.
Zet dit in je Custom CSS, en je bent klaar:

Cascading Stylesheet:
1
2
3
body.hero #contentArea {
  margin-top: -200px;
}

Waarbij die -200px alles kan zijn wat je maar wilt, natuurlijk :P

The devil is in the details.