Я, кажется, врезался в стену с этим вопросом макет:CSS: UL элементы принимает неправильный размер, когда упаковка LI элементы
Я получил специально позиционируется <div id="content"> с <ul id="grid"> внутри него. Каждый из <li> сетки имеет <a> с изображением <img> (thumbnails), ссылаясь на изображение большего размера. Это создает приличную сетку изображения, гибкую по размеру, поскольку элементы <li> обертывают меньшие размеры окна. Довольно простой, деградирует красиво и т. Д.
Проблема в том, что теперь я хотел бы центрировать сетку в пределах <div>. Я устанавливаю <ul> в float: left; так, чтобы он сокращался до размера содержащихся элементов вместо стандартной ширины по умолчанию 100%. Затем я использую position: relative; right: 50%;, а затем position: relative; left 50%; на <li>. Это должно привести в движение перемещение списка по центру в div (вы можете получить лучшее представление о том, что я собираюсь делать с reading this article), но проблема в том, что <ul> пытается растянуться так широко, насколько это возможно размещать переполненный список и, следовательно, шире, чем площадь его содержащих элементов. Конечным результатом является то, что вычисления отбрасываются, а моя сетка не центрирована.
Если это требует уточнений, я сделаю все возможное, но вопрос в следующем: возможно ли принудительно скрыть элемент (в данном случае <ul>) до размера его дочерних элементов в ситуации, когда упаковка происходит? Я пытаюсь полностью избежать javascript.