代码之家 › 专栏 › 技术社区 › GSto

CSS和浮动的问题

css

GSto · 技术社区 · 14 年前

我有一个框,在这里我试图在右下角添加一个按钮,但是当我试图向右浮动它时,它会在我放置它的分区之外结束。我怎么修这个?

代码:

    <!doctype html>
<html>
    <head>
        <style>
        #sidebar {
            width: 340px;
            float:left;
        }

        .side_block {
            background-color: #FFFFFF;
            padding:8px;
            margin: 8px;
            border-radius: 12px;
            border: 1px solid #AAAAAA;
        }
        .addLink{
            float:right;
            font-size:12px;
        }   
        </style>
    </head>
    <body>
        <div id="sidebar">
            <div class="side_block">

                        <h4>Files</h4>
                        <ul>
                            <li><a href="#">Original Emails.doc</a></li>
                            <li><a href="#">Homepage Draft.jpg</a></li>
                            <li><a href="#">First_Draft.txt</a></li>
                        </ul>
                        <input type="button" class="addLink" value="+Add File" style="float:right;">
            </div>
        </div>
    </body>
</html>

3 回复 | 直到 14 年前

Dustin Laine 14 年前

清除浮球:

<div class="side_block">

            <h4>Files</h4>
            <ul>
                <li><a href="#">Original Emails.doc</a></li>
                <li><a href="#">Homepage Draft.jpg</a></li>
                <li><a href="#">First_Draft.txt</a></li>
            </ul>
            <input type="button" class="addLink" value="+Add File" style="float:right;">
            <br style="clear: right;" />
</div>

meder omuraliev 14 年前

添加 overflow:hidden; zoom:1; 到 .side_block 到 clear your float .

Drew Wills 14 年前

试试这个…

<body>
  <div id="sidebar">
    <div class="side_block">
      <input type="button" class="addLink" value="+Add File" style="float:right;">
      <h4>Files</h4>
      <ul>
        <li><a href="#">Original Emails.doc</a></li>
        <li><a href="#">Homepage Draft.jpg</a></li>
        <li><a href="#">First_Draft.txt</a></li>
      </ul>
    </div>
  </div>
</body>

推荐文章

YunusoviÄ · 我无法用css更改html段落颜色

1 年前

Blake · 无法使用CSS旋转Angular 15中的字体图标

1 年前

Maarten -Monica for president · 将图像放在锚点标记内时调整网格中的图像大小

1 年前

Phil Lucks · 如何制作边界的外半径?

1 年前

roy_meir · 创建自定义下拉式元素

1 年前

Community wiki · 如何为触摸设备优化网站

1 年前

Paras Chandravanshi · 为什么<ul>没有从其父<p>元素继承?

1 年前

tpetzoldt · 如何在有光泽的情况下抑制图像的抗锯齿?

1 年前

boyenec · 反应如何将css样式应用于我从api respose获得的页面的spcifc部分

1 年前

manofconstsorrow · 点击导航项目关闭汉堡菜单

1 年前