Html 事件块对齐的CSS问题

我想知道，如何使用css（没有javascript或其他），使一些东西

我将有单独的跨度和div，用于：

• 明尼苏达州（星期一-一周中的某一天）
• 30（日期）
• 九月（月）
• 标题呢

也许有什么框架可以做到这一点？或者，请提供至少不太复杂的变量示例，仅显示日期和月份

---

（我正在使用Twitter引导框架v2.3.2）

这很简单：将每个span/div的显示设置为

表格单元格

，并将

垂直对齐

设置为

顶部

，

底部

或

中间

。然后为元素设置不同的字体和大小。

类似的内容

发挥它，并调整它，以满足您的需要，但这是基本的布局

HTML:

<div class="Container">
    <div class="Row">
        <div><span>MN</span><span>30</span><span>Sep</span></div>
        <div>Some Event</div>
    </div>
    <div class="Row">
        <div><span>MN</span><span>30</span><span>Sep</span></div>
        <div>Some Event</div>
    </div>
    <div class="Row">
        <div><span>MN</span><span>30</span><span>Sep</span></div>
        <div>Some Event</div>
    </div>
</div>

.Container
{
    display: table;
    width: 500px;
    border-spacing: 20px;
}
.Row
{
    display: table-row;
}
.Row > div
{
    display: table-cell;
    font-size: 35px;
}
.Row span:first-child
{
    vertical-align: top;
    font-size: 15px;
}
.Row span:nth-child(2)
{
    vertical-align: middle;
    font-size: 30px;
    font-weight: bold;
}
.Row span:nth-child(3)
{
    vertical-align: bottom;
    font-size: 15px;
}

---

我已经删除了你与imageshack的链接，因为它已经死了。因此，我也投票决定结束，因为我不清楚你想要什么。请最终用嵌入的图像正确地重新说明您的问题。