css - 将给定部分移动到下一个可用空间-6ren

css - 将给定部分移动到下一个可用空间

转载作者：行者123 更新时间：2023-11-28 13:34:51

我有这个例子，其中我显示了一些包含在部分标签中的内容。最后我有 http://dl.dropbox.com/u/51537247/the%20app/_check_boxes_form.html这是我正在使用的代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Sales,Expenditure and Stocks </title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <link href="assets/css/bootstrap.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 20px;
        padding-bottom: 40px;
      }
      .navigation{
      background-color:##008B8B;
      border:1px solid #ADFF2F;
      }
      a{
      margin-right:20px;
      }
      label{
      width:15%;
      float:left;
      }
      article{
      margin-top:3px;
      }
      .top_article{
      border:1px dotted #CC6600;
      }
      button{
      margin-right:8%;
      }
      section{
      display:inline-block;
      border:1px solid orange;
      width:100px;
      margin-bottom:10px;
      }
      .price_section{
      width:40px;
      }
      .contain_sections{
      width:100%;
      margin-left:15%;
      }
      .services_articled{
      overflow:hidden;
      }
    </style>
    <link href="assets/css/bootstrap-responsive.css" rel="stylesheet">

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="assets/ico/favicon.ico">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
  </head>

  <body>

    <div class="container">
     <div class="row">
      <!-- Main hero unit for a primary marketing message or call to action -->
      <div class="span12 navigation">
      <a href="home.html">Home</a> <a href="services.html">Services</a><a href="expenses.html">Expenses</a><a href="daily_income.html">Daily Income</a><a href="daily_expenditure.html">Daily Expenditure</a><a href="analysis_dashboard.html">Analysis Dashboard</a><a href="account.html">Account</a>  
      </div>
      </div>
      <!-- Example row of columns -->
      <div class="row">
        <div class="span12">
        <article class="top_article">
        <article>
        <label>Date</label><input type="text" disabled="disabled" name="service_name" />
        </article>
         <article>
        <label>Customer Name</label><input type="text" name="service_name" />
        </article>
        <article class="services_articled">
        <label>Services Offered</label>
        <article class="contain_sections">
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" /></footer>
        </section>
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" /></footer>
        </section>
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" /></footer>
        </section>
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" /></footer>
        </section>
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" /></footer>
        </section>
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" /></footer>
        </section>
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" /></footer>
        </section>
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" value="eighth"/></footer>
        </section>
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" /></footer>
        </section>
        <section>
        <header>Tour Guiding</header><input type="checkbox" name="tour" /><footer><input class="price_section" type="text" name="tour_price" /></footer>
        </section>
        </article>
        </article>
        <article>
        <label>Services Totals</label><input type="text" name="service_name" />
        </article>
        <button>Save New</button><button>Cancel</button>
        </article>
        </div>
        </div>
      <hr>

      <footer>
        <p>&copy; Company 2012</p>
      </footer>

    </div> <!-- /container -->

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="assets/js/jquery.js"></script>
    <script src="assets/js/bootstrap-transition.js"></script>
    <script src="assets/js/bootstrap-alert.js"></script>
    <script src="assets/js/bootstrap-modal.js"></script>
    <script src="assets/js/bootstrap-dropdown.js"></script>
    <script src="assets/js/bootstrap-scrollspy.js"></script>
    <script src="assets/js/bootstrap-tab.js"></script>
    <script src="assets/js/bootstrap-tooltip.js"></script>
    <script src="assets/js/bootstrap-popover.js"></script>
    <script src="assets/js/bootstrap-button.js"></script>
    <script src="assets/js/bootstrap-collapse.js"></script>
    <script src="assets/js/bootstrap-carousel.js"></script>
    <script src="assets/js/bootstrap-typeahead.js"></script>

  </body>
</html>

我正在使用 overflow:hidden; 来 overflow hidden 的元素，但我希望溢出移动到下一个有足够空间的地方，因为隐藏了溢出，一些重要的文本被隐藏了.我已经用第八个值标记了溢出元素。

最佳答案

这段代码就是问题所在

.contain_sections{
      width:100%;
      margin-left:15%;
      }

我把它修好了

 .contain_sections{
       margin-left:15%;
       }

关于css - 将给定部分移动到下一个可用空间，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13101379/

文章推荐： swift - 如何为标签添加约束？

文章推荐： javascript - 我的 JQuery 函数出了什么问题？

文章推荐： swift - 从 map 中删除注释 - Swift

perl - 给定/当值未定义时
在下面的代码中，我得到一个 uninitialized value警告，但仅限于第二个 given/when例子。为什么是这样？ #!/usr/bin/env perl use warnings; u
perl - 给定/何时的哪些部分是实验性的？
整个“开关”功能是否已成为实验性的？在没有 Perl 的 future 版本破坏我的代码的情况下，我可以依赖其中的某些部分吗？一般来说，将稳定功能更改为实验性的政策是什么？背景use feature
c++ - 条件语句(给定)
有没有办法在一个条件语句中写出如下语句？ a和b不能同时等于5。 (a可以是5，b可以是5，但是a AND b不能是5) 最佳答案正如克里斯指出的那样，您要查找的是逻辑异或，相当于逻辑不等于 !=:
给定 n 条线查找所有线段交点的算法
我正在寻找一种算法来找到给定 n 条线段的所有交点。以下是来自 http://jeffe.cs.illinois.edu/teaching/373/notes/x06-sweepline.pdf 的伪
python - 给定 k 个标记的最大项目
数组中有 N 个元素。我可以选择第一项最多 N 次，第二项最多选择 N-1 次，依此类推。我有 K 个 token 要使用并且需要使用它们以便我可以拥有最大数量的项目。 arr = [3, 4, 8
python - 给定 Spacy 中的引理是否有可能获得单词列表？
我正在尝试修复法语文本中的语法性别，想知道是否有办法从某个词条中获取所有单词的列表，以及是否可以在此类列表中进行查找？最佳答案尝试: import spacy lemma_lookup = spa
winapi - 给定 HWND，如何从所有者绘制的窗口中提取文本信息？
我正在为 Win32 编写一个简单的自动化测试应用程序。它作为一个单独的进程运行，并通过 Windows API 访问目标应用程序。我可以阅读窗口层次结构，查找标签和文本框，并通过发送/发布消息等来单
javascript - 给定 JSON 中的第一行是什么？
在 nodeJs 中使用 Sequelize 时，我从 Sequelize 收到此错误，如下所示: { [SequelizeUniqueConstraintError: Validation erro
python - 给定 CNN 的回归激活映射
本文https://arxiv.org/pdf/1703.10757.pdf使用回归激活映射 (RAM) - 而不是类激活映射 (CAM) 来解决问题。有几篇文章描述了如何实现 CAM。但是我找不到
ios - 给定 mach_header 我如何找到二进制图像名称？
我正在研究 Mach 动态链接器 dyld。这个问题适用于所有 Apple 平台，但很高兴得到特定于平台的答案；我正在使用 ObjC，但如果对你有用的话，我也很乐意翻译 Swift。 The rele
instagram - 给定 user_id，如何找到用户名？
我有一个包含数千个 Instagram 用户 ID 的列表。我如何获得他们的 Instagram 用户名/句柄？最佳答案你必须使用这个 Instagram API: https://api.ins
scala - 给定 Elasticsearch 无效模式
我在下面的代码: def main(args: Array[String]) { val sparkConf = new SparkConf().setAppName("Spark-Hbase").s
excel - 给定 2 个日期时查找单元格范围
我有一个表格，其中包含从 1 到 10 的数字。(从 D2 到 M2) 假设A1中有03/09/2019 并且在B1中有06/09/2019 并且在C1中有Hello 在A 列中，我有多个系列的单词，
java - 给定 URI 的注释检索
我想在给定服务对应的 URI 的情况下检索服务的注释(特别是 @RolesAllowed )。这是一个例子: 服务: @GET @Path("/example") @RolesAllowed({ "B
oracle - 给定 JDBC 连接上的并发查询？
我看到 OraclePreparedStatementexecuteQuery() 表现出序列化。也就是说，我想使用相同的连接对 Oracle 数据库同时运行两个查询。然而，OraclePrepare
java - 给定 k，使用递归求几何和
import java.util.Scanner; public class GeometricSumFromK { public static int geometricSum(int k,
java - 给定 HttpServletRequest 的网页服务的良好模式是什么？
我创建了一个抽象基类Page，它说明了如何构建动态网页。我正在尝试想出一种基于作为 HttpServletRequest 传入的 GET 请求生成 Page 的好方法。例如... public cla
java - 给定 SMS 字符串的正则表达式是什么
我的字符串是一条短信，采用以下两种格式之一: 潜在客户短信: 您已收到 1 条线索标题:我的领导潜在客户 ID:12345-2365 警报设置 ID:890 短信回复: 您已收到 1 条回复标题
python - 给定 python 中的字符串列表
我在 python 中有以下代码: class CreateMap: def changeme(listOne, lisrTwo, listThree, listFour, listfive):
java - 给定 id 的多个实体的高效缓存感知获取
这是在 Hibernate 上运行的 JPA2。我想检索相同实体类型的多个实例，给定它们的 ID。其中许多已经在持久性上下文和/或二级缓存中。我尝试了几种方法，但似乎都有其缺点: 当我使用 ent

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

css - 将给定部分移动到下一个可用空间