CSS-стилизация для нескольких div-ов и медиапроигрывателя - PullRequest
0 голосов
/ 29 сентября 2011

Я пытаюсь оформить следующую страницу:

http://www.davedaranjo.com/media.html

Проблема, с которой я столкнулся, заключается в том, что мне действительно нужно центрировать div влево и div прямо на странице с заголовком. Может кто-нибудь предложить стиль или атрибут, который бы просто переместил весь раздел под заголовком в середину страницы?

Спасибо!

Ответы [ 2 ]

0 голосов
/ 29 сентября 2011

Одна вещь, которую вы можете сделать, это сделать так, чтобы div под телом, который выровнен по центру, также содержал div с классом ttw-music-player.

Примечание: я не уверен, знаете ли вы это, но div ttw-music-player - это фактический контент справа. В div с идентификатором 'right' ничего нет, так как на самом деле javascript там ничего не помещает на страницу.

Как только вы это сделаете, вы можете установить центрирующий div, чтобы он имел определенную ширину, а также установить его на margin: auto; вместо align: center;. Это сворачивает заголовок, а левый и правый контент делится на контейнер. После этого укажите фиксированную ширину в левом и правом элементах div, чтобы они занимали равное количество пространства, которое в сумме в точности соответствует ширине контейнера div. Затем плавают один влево, а другой направо. Возможно, вам придется поиграть с width, padding и / или margin, чтобы получить все с точностью до пикселя.

Кроме того, я бы предложил не использовать таблицы ни для чего, кроме реальных таблиц данных, и использовать CSS-файлы в <head> для всех ваших стилей. Как правило, вам следует держаться подальше от встроенных стилей, которые встречаются внутри самого html-файла, и просто использовать JavaScript для добавления или удаления классов CSS для элементов, вызывая встроенные стили из вашего JavaScript, только если это абсолютно необходимо. Так проще поддерживать.

0 голосов
/ 29 сентября 2011

Пара баллов.

  1. Вы не должны использовать таблицы для макетов .
  2. Музыкальный проигрыватель не является частью вашего div # права, JavaScript вставляет его после вашего.

Но, если вы хотите придерживаться сайта как есть, следующие компоненты будут центрировать все компоненты для вас:

<body style="width: 1024px; margin: 0 auto;">

Обратите внимание, CSS должен бытьхранится в файле, внешнем по отношению к вашему HTML .Если вы используете отдельный файл, добавьте в него следующее:

body { width: 1024px; margin: 0 auto; }
...