Зачем табличка? Если сделать так:<div id="title-bar">
<span id="r_date">15.03.2019 21:30</span>
<span id="r_title"><h2>Релиз сетевого конфигуратора NetworkManager 1.16</h2></span>
</div>
а затем либо:
<style>
#title-bar {
color: #606090;
font: bold 11pt Arial, Helvetica;
padding-left: 2em;
display: flex;
flex-flow: column-reverse;
}
#r_date {
order: 1;
font-size: 10pt;
width: 100%;
text-align: left;
}
#r_title {
order: 2;
}
</style>
либо:
<style>
#title-bar {
color: #606090;
width: 100%;
padding-left: 2em;
padding-top: 0.5em;
padding-bottom: 0.5em;
display: flex;
font: bold 11pt Arial, Helvetica;
background: #c7cbb1;
border-bottom: 3px solid #b8b198;
flex-flow: row;
}
#r_date {
order: 1;
text-align: left;
margin-right: 1em;
color: #3399ff;
}
#r_title {
order: 2;
width: 100%;
text-align: left;
}
#r_title > h2 {
display: inline;
}
</style>
Там если подумать поглубже, может можно лучше сделать с этими margin'ами и padding'ами, чтобы было больше похоже на старый дизайн, или чтобы css на десять байт сократить. Может h2 можно выкинуть, он там мешает если, по-хорошему, но без него может какие-нибудь режимы просмотра сломаются или может у кого юзер-css'ы на h2 -- хз. Я не вебдизайнер, не знаю и не умею, я и из-за этого-то минут пятнадцать экспериментировал.
Но фишка в том, что избавившись от таблички, дальше можно просто отдавать разные css в зависимости от куков, чтобы аутисты могли бы со старым дизайном, не сталкиваясь с необходимостью рвать свои железобетонные шаблоны. Или даже не отдавать разные css: в конце-концов никто не запрещает загрузить user-css.
