да ради бога. решение, которое выше я дал, вам подойдет.
теперь о бекграунде... вы не поняли нечего. уберите картинку между совсем. удалите ее. вместо нее задает размер и display: block и background-image: url('ваша картинка') для тега а. Эффект будет такой какой вам нужен.
Алексей Струков: заказчик наоборот простит убрать всякие левые либы с сайта. даже на jq косо смотрит. собственно сейчас галерея сделана на js, просили изучить возможность сделать аналог на css
Логику понимаю, но так не получится. Большая картинка - это бекграунд, без повторений, настоящего размера, с позицией по центру. Остальная область заполнена цветом бекграунда. Т.е. это один элемент размером во все окно браузера. По другому сделать нельзя так как потребуется JS. А у меня галерея только на HTML+CSS. Относительно крестика - он ничего не будет делать, нажимай или нет. Нужен чтобы пользователь знал, что можно закрыть. А закрываться картинка будет по клику в любой области экрана. Этакая фиктивная кнопка.
Ну раз вы догадались снизу убрать border, то почему у "Ваше имя" справа не догадались убрать? Да и задавать размеры в px, подгоняя их к друг другу - дурной тон.
Нет, потому что контент, который будет в зеленых блоках нельзя уменьшать по ширине бесконечно. Их ширина должна быть не менее 150px. Если пользователь смотрит с мобильного (ширина 320px), мы показываем максимум 2 блока. Но вопрос не в этом. Мне нужно отцентрировать зеленые блоки, так, чтобы они располагались по центру розового, не зависимо от их количества. Что-то вроже text-align: center для розового контейнера или justify-content: center, если бы можно было flexbox использовать.
Александр Котов: Откройте пример. В вашем браузере будет отображено несколько зеленых блоков. Если вы уменьшите ширину окна брайзера количество зеленых блоков уменьшится. Это правильная работа кода, так и должно быть. Однако обратите внимание, зеленые блоки прижаты к левой стороне контейнера. А мне нужно, чтобы они были по центру.
Don_Donald: Это не имеет значения... Главное, чтобы на широких экранах, где влезает большее число блоков их было показано больше, а на узких где места недостаточно их было меньше. Мой пример работает, только мне нужно, чтобы внутри контейнера группа блоков располагалась по центру...