Devam Ediyor

Pinterest like images grid (single page) No JS, Perfect Cumulative Layout Shift (CLS) score required

I need a HTML/CSS only image grid like shown here: [login to view URL]

I don't want to use masonry or other JavaScript lib, as this moves the images around after the page has been loaded, causing a bad Google Cumulative Layout Shift (CLS) rating. Pinterest seems to solve this issue without JavaScript.

I know the height and width of each image, so when rending the grid via PHP we can use that information to "build" the right html.

It's important that images render from left to right. Not down.

All images have a fixed width, and variable height. But both values are known in advance.

I currently use masonry to render this grid, but I want to move away from this to achieve a perfect Cumulative Layout Shift (CLS) rating. On resize of the page, the columns should re-adjust.

I just need a single page HTML/CSS, I will then implement it on my website myself.

Beceriler: CSS, HTML, Web Sitesi Tasarımı

Daha fazlasını gör: single page templates, single page checkout oscommerce, authorizenet single page, single page application php, best single page web designs, Single page Html with CSS and JS, page php, single page application vanilla js, single page no scroll website, single page application spa with asp net web api and angular js, next js single page application, how to create single page application using vue js, build a single page app with vue js, single page application using react js, facebook like photo grid plugin with jquery images grid, single page application vue js laravel, laravel vue js single page application, turn.js single page example, developing single page applications from html to ruby on rails to react js, single page application node js

İşveren Hakkında:
( 0 değerlendirme ) Ordino, Spain

Proje NO: #30566392

Seçilen:

wanderliver

Hi. I have checked your project description and I am very confident to do this project. I mastered web development and have much experience. I am strong in database design and working with query. I am not any agent or Daha Fazla

%selectedBids___i_period_sub_7% gün içinde 140%project_currencyDetails_sign_sub_9% %project_currencyDetails_code_sub_10%
(4 Değerlendirme)
3.5

Bu iş için 7 freelancer ortalamada $124 teklif veriyor

(16 Değerlendirme)
6.5
(41 Değerlendirme)
5.7
askross

Hello, how are you? I have read your post "Pinterest like images grid (single page) No JS, Perfect Cumulative Layout Shift (CLS) score required" carefully, and feel I'm suited to this job. I have a professional experie Daha Fazla

$140 USD in 7 gün içinde
(7 Değerlendirme)
3.1
Rohit9602

Hello, I've read and understood your project description. I can design and build a website as per your expectations and I am absolutely sure that I can do the project very well. I have 5+ years of experience as a Web d Daha Fazla

$70 USD in 7 gün içinde
(6 Değerlendirme)
3.1
sachinranakasmp7

Hi mate I have 7+experience in html, html 5, java script, PHP, web design, CSS, graphic design.I read your all requirement.I can do it.. My skills: HTML, CSS, SASS, J Query ,Woocommerce, JavaScript, Bootstrap, WordPre Daha Fazla

$140 USD in 7 gün içinde
(2 Değerlendirme)
0.9
mmirja16

Hi, I read your project description carefully,You need a single page [login to view URL] don't worry I have 2 years experience about the html,css sass and bootstrap. I ensure you ,I'll fix your problem and it will be looked like Daha Fazla

$100 USD in 7 gün içinde
(0 Değerlendirme)
0.0