Отображение абзацев в табличном стиле без таблиц

Question

Быстрый вопрос о некоторых CSS. У меня была эта страница, которая была закодирована с таблицами, и теперь я хотел бы перевести ее на CSS. Таблица содержит фотографии и контактную информацию для списка людей, поэтому она была помещена в таблицу 2х2 (там четыре человека). Теперь есть четыре абзаца, заполненные необходимой мне информацией, мне просто нужно выложить их в правильном порядке. В настоящее время они относятся к одному классу, поможет ли добавить идентификаторы ко всем из них?

Answer 1

Нет, все в порядке, если они одного класса. Допустим, у них есть класс myblock.

.myblock {
    width:50%;
    padding:0;
    margin:0;
    float:left;
}
.myblock img {
    float:left;
    padding-right:10px;
}

Тогда этот код просто поместит два из этих блоков рядом друг с другом, по два в строке.

<div class="myblock"> 
        <!-- The paragraph --> 
        <img src="people/photo.jpg"/> 
        Name<br/>
        Position<br/> 
        Tel. 123 12345-314
</div>

Answer 2

Добавьте их в контейнер <div class="container"> и присвойте тегам <p> следующие стили:

div.container p {
    width:50%;
    float:left;
}

Надеюсь, это поможет.

Answer 3

Попробуйте это ...

p {
    display: table-cell
} 

Редактировать: Каков правильный порядок?Можете ли вы опубликовать примеры кода или макета?