Выровнять текст в конце и начале div

Question

Выровнять текст в конце и начале div

В настоящее время у меня есть решение, но я почти уверен, что есть лучшее решение там. По сути, у меня есть блочный элемент, и я хочу выровнять часть текста в начале моего блока, а другую - в конце.

Вот небольшой пример jsfiddle

То, что я делаю, использует float и еще 2 блок-элемента внутри, чтобы выровнять его:

<div id="block">
    <div id="start">1</div>
    -
    <div id="end">12</div>
</div>

#block {
    text-align:center;
    background: #000;
    color: white;
    width:150px;
}
#start {
    float:left;
}
#end {
    float:right;
}

У меня есть много таких маленьких объектов, поэтому мой код раздут div"S. Там нет более легкого решения для этого там?

2

css text-alignment

Источник

user945722 18 дек '11 в 14:34

2 ответа

Решение

Может быть, вы можете использовать CSS :after & :before псевдо-классы, как это:

HTML:

<div id="block">
    hello
**</div>

CSS: **

#block {
    text-align:center;
    background: #000;
    color: white;
    width:150px;
    overflow:hidden;
}
#block:before{
    content:"1";
    float:left;
}
#block:after{
    content:"12";
    float:right;
}