2013-07-31 3 views
-2

В нижнем колонтитуле моей страницы http://www.imbued.co.uk/ Я получаю ошибки в тестировании соответствия W3C, по понятным причинам, поскольку я использовал атрибут align inline для вертикального выравнивания значков социальных сетей с соответствующим текстом. Какая правильная альтернатива использования CSS? Если я удаляю атрибут align, текст и изображение не находятся в центре, и, очевидно, нет центрированного поплавка.Исправить CSS, чтобы заменить элемент выравнивания img

ответ

0

Есть несколько вариантов. Лучший, вероятно, установить стиль на тех элементах, чтобы использовать margin: auto;

margin-left: 50%; 
margin-right: 50%; 
margin: auto; 

В случае одного из изображений, например, это будет выглядеть примерно так:

<img style='margin-left: 50%; margin-right: 50%; margin: auto;' src=... /> 

Конечно, вы должны просто поместить css в класс и установить класс всего, что вы хотите сосредоточить на этом классе. Класс CSS будет выглядеть следующим образом:

.centered { 
    margin-left: 50%; 
    margin-right: 50%; 
    margin: auto; 
} 
+0

Не могли бы вы поместить меня туда, где в CSS, пожалуйста. Я пробовал его под несколькими, и он, похоже, не поддерживает внешний вид. – green4rrow

+0

Я пробовал ваше предложение для изображения facebook в нижнем колонтитуле, но текст не выровнен с изображением, как в центре, как с твиттером/pinterest значки, если я не внедрил его неправильно – green4rrow

+0

Разрешено использование линии-высоты в сочетании с выравниванием по вертикали: средний для этого. Пример: ul li { дисплей: блок; высота: 100px; line-height: 100px; } ul li img { вертикально-выровненный: средний; } – green4rrow

0

align переводит лучше всего Css text-align

так

<div align="left">text</div> 

становится

<div class="left">text</div> 

и css:

.left { 
text-align:left; 
}