css - 如何使用CSS在表格外向左对齐文本

我试图将文本“筛选依据：”左对齐。为了保证页边距，在调整Windows屏幕大小（响应）时，它可能不起作用。我尝试了text-align: left或center，但没有按预期工作。

实际上，可以将div元素更改为另一个元素以使其起作用。

这是Fiddle链接：
https://jsfiddle.net/a26jsLg5/

请参见以下屏幕截图，该截图应为以下形式：

.searchType table {
        border: 1px solid #A6A6A6;
        margin: 0px auto;
    }

<TD style="VERTICAL-ALIGN: text-top">
  <DIV>Filter by:</DIV>
  <DIV class=searchType>
    <TABLE>
      <TBODY>
        <TR>
          <TD>
            <INPUT type=radio CHECKED value=FullMap />
            <LABEL>Com 1</LABEL>
          </TD>
          <TD>
            <INPUT type=radio value=MissingCourses />
            <LABEL>Com 2</LABEL>
          </TD>
          <TD>
            <INPUT type=radio value=NeedToLearn />
            <LABEL>Com 3</LABEL>
          </TD>
        </TR>
      </TBODY>
    </TABLE>

最佳答案

看看这个。https://codepen.io/jayakrishnancn/pen/WjBpZa

用JavaScript的第一种方法

改变这条线

<DIV>Filter by:</DIV>
<DIV class=searchType>

至

<DIV class="searchType">
<DIV id="filter_text" style="margin:0 auto">Filter by:</DIV>

并将此脚本添加到页面

<script>
 $('#filter_text').width($('#filter_text').next().width());
</script>

第二个ID您事先知道桌子的最大宽度，然后使用它

<DIV class='searchType' style="width: 200px;margin:0  auto">
<DIV>Filter by:</DIV>
<TABLE style="width:100%">

这里不需要脚本，“ filter by”也将保留在正确的位置（在以前的方法中，“ filter by”将放置在左侧，仅在运行jquery funtion时才移至右侧。

关于css - 如何使用CSS在表格外向左对齐文本，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44223608/