Rowgrid.js \u2014 \u044d\u0442\u043e \u043f\u043b\u0430\u0433\u0438\u043d jQuery \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u0432 \u0440\u044f\u0434.<\/p>\n\n\n\n
\u041f\u0440\u043e\u0441\u0442\u043e\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u0441\u0435\u0442\u043a\u0438 \u0441\u0442\u0440\u043e\u043a, \u043a\u0430\u043a \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e \u043d\u0438\u0436\u0435 \u2014<\/p>\n\n\n\n
<!doctype html>\n<html lang = \"en\">\n <head>\n <meta charset = \"UTF-8\">\n\t\t\n <style>\n .container:before,\n .container:after {\n content: \"\";\n display: table;\n }\n .container:after {\n clear: both;\n }\n .item {\n float: left;\n margin-bottom: 15px; \n }\n .item img {\n max-width: 100%;\n max-height: 100%;\n vertical-align: bottom;\n }\n .first-item {\n clear: both;\n }\n .last-row, .last-row ~ .item {\n margin-bottom: 0;\n }\n <\/style>\n\t\t\n <script \n src = \"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jquery\/2.0.3\/jquery.min.js\">\n <\/script>\n <script src = \"\/jquery\/src\/rowgrid\/jquery.row-grid.js\">\n <\/script>\n\t\t\n <script>\n $(document).ready(function(){\n $(\".container\").rowGrid({itemSelector: \".item\", \n minMargin: 10, maxMargin: 25, firstItemClass: \"first-item\"});\n });\n <\/script>\n <\/head>\n\t\n <body>\n <!-- Items with example images -->\n\t\t\n <div class = \"container\">\n <div class = \"item\">\n <img src = \"https:\/\/www.tutorialspoint.com\/images\/75-logo.jpg\" \n width = \"220\" height = \"200\" \/>\n <\/div>\n\t\t\t\n <div class = \"item\">\n <img src = \n \"https:\/\/www.tutorialspoint.com\/images\/absolute-classes-free.jpg\" \n width = \"180\" height = \"200\" \/>\n <\/div>\n\t\t\t\n <div class = \"item\">\n <img src = \"https:\/\/www.tutorialspoint.com\/images\/absolute-classes-latest-technologies.jpg\" \n width = \"250\" height = \"200\" \/>\n <\/div>\n\t\t\t\n <div class = \"item\">\n <img src = \"https:\/\/www.tutorialspoint.com\/images\/absolute-classes.jpg\" \n width = \"200\" height = \"200\" \/>\n <\/div>\n\t\t\t\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/240\/200?5\" \n width = \"240\" height = \"200\" \/>\n <\/div>\n\t\t\t\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/210\/200?6\" \n width = \"210\" height = \"200\" \/>\n <\/div>\n\t\t\t\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/260\/200?21\" \n width = \"260\" height = \"200\" \/>\n <\/div>\n\t\t\t\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/220\/200?22\" \n width = \"220\" height = \"200\" \/>\n <\/div>\n\t\t\t\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/220\/200?1\" \n width = \"220\" height = \"200\" \/>\n <\/div>\n\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/180\/200?2\" \n width = \"180\" height = \"200\" \/>\n <\/div>\n\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/250\/200?3\" \n width = \"250\" height = \"200\" \/>\n <\/div>\n\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/200\/200?4\" \n width = \"200\" height = \"200\" \/>\n <\/div>\n\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/240\/200?5\" \n width = \"240\" height = \"200\" \/>\n <\/div>\n\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/210\/200?6\" \n width = \"210\" height = \"200\" \/>\n <\/div>\n\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/200\/200?7\" \n width = \"200\" height = \"200\" \/>\n <\/div>\n\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/190\/200?8\" \n width = \"190\" height = \"200\" \/>\n <\/div>\n\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/260\/200?9\" \n width = \"260\" height = \"200\" \/>\n <\/div>\n\n <div class = \"item\">\n <img src = \"https:\/\/lorempixel.com\/220\/200?10\" \n width = \"220\" height = \"200\" \/>\n <\/div> \n\n <\/div>\n <\/body>\n<\/html><\/pre>\n","protected":false},"excerpt":{"rendered":"Rowgrid.js \u2014 \u044d\u0442\u043e \u043f\u043b\u0430\u0433\u0438\u043d jQuery \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u0432 \u0440\u044f\u0434. \u041f\u0440\u043e\u0441\u0442\u043e\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u0441\u0435\u0442\u043a\u0438 \u0441\u0442\u0440\u043e\u043a, \u043a\u0430\u043a \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e \u043d\u0438\u0436\u0435 \u2014 <!doctype html> […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"categories":[154],"tags":[],"class_list":["post-4874","page","type-page","status-publish","hentry","category-jquery"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.bearloga.space\/uk\/wp-json\/wp\/v2\/pages\/4874","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bearloga.space\/uk\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.bearloga.space\/uk\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.bearloga.space\/uk\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bearloga.space\/uk\/wp-json\/wp\/v2\/comments?post=4874"}],"version-history":[{"count":0,"href":"https:\/\/www.bearloga.space\/uk\/wp-json\/wp\/v2\/pages\/4874\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.bearloga.space\/uk\/wp-json\/wp\/v2\/media?parent=4874"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bearloga.space\/uk\/wp-json\/wp\/v2\/categories?post=4874"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bearloga.space\/uk\/wp-json\/wp\/v2\/tags?post=4874"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}