标签: alignment

两个HTML表并排,以页面为中心

我在页面上有两个表,我想要并排显示,然后将它们放在页面中(实际上在另一个div中,但这是我能想到的最简单的):

<style>
  #outer { text-align: center; }
  #inner { text-align: left; margin: 0 auto; }
  .t { float: left; }
  table { border: 1px solid black; }
  #clearit { clear: left; }
</style>

<div id="outer">
  <p>Two tables, side by side, centered together within the page.</p>

  <div id="inner">
    <div class="t">
      <table>
        <tr><th>a</th><th>b</th></tr>
        <tr><td>1</td><td>2</td></tr>
        <tr><td>4</td><td>9</td></tr>
        <tr><td>16</td><td>25</td></tr>
      </table>
    </div>

    <div class="t">
      <table>
        <tr><th>a</th><th>b</th><th>c</th></tr>
        <tr><td>1</td><td>2</td><td>2</td></tr>
        <tr><td>3</td><td>5</td><td>15</td></tr>
        <tr><td>8</td><td>13</td><td>104</td></tr>
      </table>
    </div>

  </div>
  <div id="clearit">all done.</div>
</div>
Run Code Online (Sandbox Code Playgroud)

我知道这与表格浮动这一事实有关,但我不知道自己错过了什么.有许多网页描述了我在这里展示的技术,但无论如何它都不起作用; 桌子固执地靠在左边缘.

css center alignment

26
推荐指数
5
解决办法
10万
查看次数

c ++数据对齐/成员顺序和继承

如果使用继承/多重继承,数据成员如何对齐/排序?这个编译器是否具体?

有没有办法在派生类中指定如何对成员(包括基类中的成员)进行排序/对齐?

谢谢!

c++ inheritance alignment

26
推荐指数
1
解决办法
1万
查看次数

如何在一条线上垂直居中图像?

当图像小于线高时,在线上居中图标的最佳方法是什么?

例如(样式内联以便于阅读):

<div style="line-height: 20px">
  <img style="width: 12px; height: 12px;"/>
  Blah blah blah
</div>
Run Code Online (Sandbox Code Playgroud)

这是一个jsFiddle示例.这个例子也说明了为什么vertical-align: middle不起作用.

我希望img以div的文本为中心.也就是说,即使文本被包裹到多行,图像也会以单行为中心.理想情况下,解决方案不会涉及在图像上设置边距/填充,即使我不知道线高也可以工作.

我读过的东西:

如何使用CSS垂直对齐图像旁边的文本?(处理图像较大的情况,这里似乎不适用)

了解垂直对齐

html css alignment vertical-alignment

26
推荐指数
1
解决办法
2万
查看次数

来自另一个View的Android RelativeLayout alignCenter

我有一个RelativeLayout有两个孩子,也RelativeLayout包含几个按钮和东西.这些子布局不是在我的主布局中居中,主布局确实包含了这两个方面的一些其他东西.我希望第一个在第二个之上.这很容易,只需android:layout_below="@+id/firstLayout"在第二个使用.但我也希望第二个在第一个的中心对齐.我的意思是我想要第二个布局找到第一个布局的中心,并对齐自己,使其中心位于相同的x位置.我明白了alignLeft, alignRight, alignTop, and alignBaseline,但没有中心.是否可以这样做而不必硬编码边距来扫描第二个布局?

这是我想要最终得到的一个粗略的例子,蓝色条将是第一个布局,红色框将是第二个布局.我知道我可以将它们包装在另一个RelativeLayout大小相等的区域中"wrap_content",然后centerHorizontal="true"用于第二个区域.但我真的宁愿把两个都留作我的主要布局的孩子(如果我让他们成为一个单独布局的孩子,我将不得不对我的应用程序的某些部分的工作方式进行一些更改.我试图避免这种情况.)

我想要的例子

android alignment android-relativelayout

26
推荐指数
2
解决办法
2万
查看次数

元素"对齐"是过时的或非标准的:我应该使用什么呢?

我有这个HTML代码:

<td align="center">
Run Code Online (Sandbox Code Playgroud)

我在ReSharper的Visual Studio 2008中收到此错误:

"元素' align已过时或非标准"

什么是替代此代码以使其成为标准?

html css center alignment

26
推荐指数
4
解决办法
3万
查看次数

如何在reStructuredText简单表中右对齐列内容?

我正在使用Sphinx编辑我的项目的文档,而Sphinx又使用reStructuredText作为标记语言.

我有一个简单的表(与网格表相对),其中最右边的列报告包含我想要正确对齐的数字,但我找不到如何实现这一点.

============  =====================
Event               Score variation
============  =====================
Event 1                        +100
Event 2                         -25
Event 3                        -400
============  =====================
Run Code Online (Sandbox Code Playgroud)

如果这可以让我解决问题,我很乐意切换到网格表.

python restructuredtext alignment tabular python-sphinx

26
推荐指数
2
解决办法
1万
查看次数

如何将bootstrap形式的输入与input-group-addons对齐?

我有一个非常简单的Bootstrap 3表单,当我不使用input-group-addons 时,我可以轻松(自动)对齐.

在我的表单中使用它们后,它是不可能对齐的(由于添加了插件,带插件的线条更宽)

<form class="form-horizontal" role="form">

    <div class="form-group">
      <label for="product_name" class="col-sm-2 control-label">Product name</label>
      <div class="col-sm-4">
        <input type="text" class="form-control" id="product_name" placeholder="Product name">
      </div>
    </div>

    <div class="form-group">
      <label for="product_price" class="col-sm-2 control-label">Price</label>
      <div class="col-sm-4 input-group">
        <span class="input-group-addon">$</span>
        <input type="text" class="form-control bfh-number" id="product_price" placeholder="Price" data-min="0" data-max="9999999">
        <span class="input-group-addon">.00</span>
      </div>
    </div>

    <div class="form-group">
      <label for="product_description" class="col-sm-2 control-label">Description</label>
      <div class="col-sm-6">
        <textarea class="form-control" id="product_description" placeholder="Description" rows="5"></textarea>
      </div>
    </div>

    <div class="form-group">
      <div class="col-sm-offset-2 col-sm-10">
        <button type="submit" class="btn btn-default">Submit</button>
      </div>
    </div>
</form>
Run Code Online (Sandbox Code Playgroud)

JsFiddle:http://jsfiddle.net/Yzxy3/

html css alignment twitter-bootstrap

26
推荐指数
2
解决办法
7万
查看次数

确定与其成员相关的C/C++结构的对齐方式

如果已知结构构件的对齐,是否可以找到结构类型的对齐?

例如.对于:

struct S
{
 a_t a;
 b_t b;
 c_t c[];
};
Run Code Online (Sandbox Code Playgroud)

是S = max(alignment_of(a),alignment_of(b),alignment_of(c))的对齐?

在网上搜索我发现"对于结构化类型,其任何元素的最大对齐要求决定了结构的对齐"(在每个程序员应该知道的内存中)但我在标准中找不到任何类似的东西(最新草稿更准确).


编辑: 非常感谢所有的答案,特别是罗伯特·甘博为原始问题提供了一个非常好的答案,以及其他贡献者.

简而言之:

为了确保结构构件的对准要求,结构的对准必须至少与其最严格构件的对准一样严格.

至于确定结构的对齐方式,我们提出了一些选项,经过一些研究,我发现了这个:

  • c ++ std :: tr1 :: alignment_of
    • 尚未标准,但关闭(技术报告1),应该在C++ 0x中
    • 最新草案中存在以下限制:前提条件:T应为完整类型,引用类型或未知范围的数组,但不应为函数类型或(可能是cv-qualified)void.
      • 这意味着我提出的使用C99灵活数组的用例将无法工作(这并不奇怪,因为灵活的数组不是标准的c ++)
    • 在最新的c ++草案中,它是用新关键字的术语定义的 - alignas(具有相同的完整类型要求)
    • 在我看来,如果c ++标准曾经支持C99灵活数组,那么要求可以放宽(结构与灵活数组的对齐不应该根据数组元素的数量而改变)
  • c ++ boost :: alignment_of
    • 主要是tr1替代品
    • 似乎是专门针对void而在这种情况下返回0(这在c ++草案中是禁止的)
    • 来自开发人员的注意事项:严格来说,您应该只依赖于ALIGNOF(T)的值是T的真实对齐的倍数,尽管在实践中它确实在我们所知道的所有情况下计算了正确的值.
    • 我不知道这是否适用于灵活的数组,它应该(可能不起作用,这解决了我的平台上的编译器内在因此我不知道它将如何在一般情况下表现)
  • Andrew Top提出了一个简单的模板解决方案,用于计算答案中的对齐方式
    • 这似乎与boost正在做的非常接近(如果它小于计算的对齐,则boost会另外返回对象大小,因为我可以看到相同的通知
    • 这适用于灵活的数组
  • 使用Windbg.exe找出符号的对齐方式
    • 不编译时,编译具体,没有测试它
  • 在包含该类型的匿名结构上使用offsetof
    • 看到答案,不可靠,不能用c ++非POD移植
  • 编译器内在函数,例如.MSVC __alignof
    • 适用于灵活的数组
    • alignof关键字在最新的c ++草案中

如果我们想要使用"标准"解决方案,我们只限于std :: tr1 :: alignment_of,但如果你将c ++代码与c99的灵活数组混合,这将不起作用.

我认为它只有一个解决方案 - 使用旧的struct hack:

struct S
{
 a_t a; …
Run Code Online (Sandbox Code Playgroud)

c c++ alignment

25
推荐指数
3
解决办法
1万
查看次数

使用CSS跨浏览器div中心对齐

使用CSS水平和垂直对齐div其位置的最简单方法是relative什么?它的宽度和高度div是未知的,即它应该适用于每个div维度和所有主要浏览器.我的意思是中心对齐.

我想使用以下方法进行水平对齐:

margin-left: auto;
margin-right: auto;
Run Code Online (Sandbox Code Playgroud)

像我一样在这里.

这是一个很好的跨浏览器水平对齐解决方案吗?

我怎么能做垂直对齐?

html javascript css jquery alignment

25
推荐指数
2
解决办法
4万
查看次数

如何将DIV锚定到页面底部?

我有一个固定宽度的DIV,我想保留在浏览器视口的底部.

不幸的是,我不知道我甚至会开始尝试实现这一点.

显然,要做的第一件事就是设定positionfixed.但除此之外......没有任何线索.

html css alignment

25
推荐指数
2
解决办法
6万
查看次数