аюсь отобразить два<div> элементы на одной линии, но в центре. Чтобы центрировать их, я должен был установитьmargin:auto; Однако, чтобы получить два на одной линии, мне нужно было выполнить одно из следующих действий:

Установленdisplay:inline; (который отменяет центрирование)Установленfloat:left; к обоим (что отменяет центрирование)Установленdisplay:table-cell; (который отменяет центрирование)

Что я могу сделать, чтобы получить обаdivs быть в центре? Или я должен использовать что-то еще, чтобы сделать это? я пробовал<span> но свойство inline делает то же самое, что указано выше для установкиdisplay:inline;.

РЕДАКТИРОВАТЬ: вот CSS для<div> элементы я пытаюсь применить это к:

.homediv {
    background-color:#F7F7F7;
    border:1px solid #FFFFFF;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    -o-border-radius:4px;
    border-radius:4px;
    /* width must be defined in the actual element because it can have various sizes */
    -webkit-box-shadow: 0px 0px 8px #888888;
    -moz-box-shadow: 0px 0px 8px #888888;
    box-shadow: 0px 0px 8px #888888;
    margin:auto;
    text-align:center;
    padding:4px;
}

В файле HTML я только добавляю ширину для каждого элемента, и теперь я пытаюсь добавить различные свойства отображения, которые решат проблему. Идея «обертки», предложенная ниже, кажется, является единственным решением, но с этим CSS, может быть, я что-то не так делаю?

ВТОРОЕ РЕДАКТИРОВАНИЕ: В качестве заключительного дополнения, что было бы лучшим способом поместить пространство между этими двумя<div> элементы, так как они имеют тени от ящиков, и я не хочу, чтобы они были сжаты вместе.