Toon posts:

Fout bij grote afbeelding op nieuwspagina.

Pagina: 1
Acties:

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



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.

  • Hahn
  • Registratie: Augustus 2001
  • Laatst online: 18:58
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.


  • computerjunky
  • Registratie: Maart 2004
  • Laatst online: 02:58
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:



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.





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

  • Hahn
  • Registratie: Augustus 2001
  • Laatst online: 18:58
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.



Tweakers maakt gebruik van cookies

Tweakers plaatst functionele en analytische cookies voor het functioneren van de website en het verbeteren van de website-ervaring. Deze cookies zijn noodzakelijk. Om op Tweakers relevantere advertenties te tonen en om ingesloten content van derden te tonen (bijvoorbeeld video's), vragen we je toestemming. Via ingesloten content kunnen derde partijen diensten leveren en verbeteren, bezoekersstatistieken bijhouden, gepersonaliseerde content tonen, gerichte advertenties tonen en gebruikersprofielen opbouwen. Hiervoor worden apparaatgegevens, IP-adres, geolocatie en surfgedrag vastgelegd.

Meer informatie vind je in ons cookiebeleid.

Sluiten

Toestemming beheren

Hieronder kun je per doeleinde of partij toestemming geven of intrekken. Meer informatie vind je in ons cookiebeleid.

Functioneel en analytisch

Deze cookies zijn noodzakelijk voor het functioneren van de website en het verbeteren van de website-ervaring. Klik op het informatie-icoon voor meer informatie. Meer details

janee

    Relevantere advertenties

    Dit beperkt het aantal keer dat dezelfde advertentie getoond wordt (frequency capping) en maakt het mogelijk om binnen Tweakers contextuele advertenties te tonen op basis van pagina's die je hebt bezocht. Meer details

    Tweakers genereert een willekeurige unieke code als identifier. Deze data wordt niet gedeeld met adverteerders of andere derde partijen en je kunt niet buiten Tweakers gevolgd worden. Indien je bent ingelogd, wordt deze identifier gekoppeld aan je account. Indien je niet bent ingelogd, wordt deze identifier gekoppeld aan je sessie die maximaal 4 maanden actief blijft. Je kunt deze toestemming te allen tijde intrekken.

    Ingesloten content van derden

    Deze cookies kunnen door derde partijen geplaatst worden via ingesloten content. Klik op het informatie-icoon voor meer informatie over de verwerkingsdoeleinden. Meer details

    janee