0

我正在尝试使用最少的 CSS 来实现 CSS 布局。目前我有它的工作，但它是一团糟。它是日历的一部分，用户可以在其中跟踪他或她的体重。但这并不重要，试着弄清楚如何使这个布局更干净会很好！

附上概念。目前我到处都有 div 和 span。单元格左上角的数字是顶部的 div。

在中间，我以三个元素为中心。第一个是空白 gif，它是另一侧图标的大小。中间是一个文本输入框。右侧的图标是图像。因为我希望一切都集中，所以我就是这样做的。文本框左侧的不可见 gif 与图标大小相同，可确保其居中。这三个元素包含在一个居中的 div 中。

在底部，我有两个并排的 div，一个向左浮动，另一个向右浮动。这些包含在一个div中。下面是我正在使用的代码的粗略概念，以及该概念的图片。乱七八糟的，有没有更好的办法呢？

<td>
    <div class='topleft'>12</div>
    <div class='main'>
        <div class='entry'>
            <span id='blankgif'><blank gif img here></span>
            <input type='text'>
            <span id='icon'><icon here></span>
        </div>
        <div class='info'>
            <div class='info_left' floated left width 49%></div>
            <div class='info_right' floated right width 49%></div>
        </div>
    </div>
</td>

在此处输入图像描述

4

0 回答 0