我需要对齐表格内容以匹配阿拉伯语联系人,并使该行从页面右侧开始。我设法将图像向左对齐,但公司信息本身不会向右对齐。文本本身向右对齐,但整体位于图像旁边的最左侧。
.companyInfo
{
background-color: red;
}
.companyLogo
{
background-color: yellow;
}
<body>
<table dir="rtl">
<tr height="100px">
<td class="companyInfo">
اسم الشركه
</td>
<td class="companyLogo">
<img src="https://internetmarketingteam.com/wp-content/uploads/2017/05/url-web-address-300x300.png" />
</td>
</tr>
</table>
</body>
我尝试让每个操作系统 col-span=4,尝试给它们每个 50% 的宽度,但这些都不起作用
您似乎正在使用表格来进行布局。这将是对表格元素的滥用,并使实现您的目标变得更加困难。
这是我对您使用 flexbox 之后的最佳猜测。
.flex-row {
display: flex; /* row by default */
}
.companyInfo {
background-color: red;
flex: auto;
display: flex;
justify-content: start;
align-items: center;
}
.companyLogo {
background-color: yellow;
}
<body>
<div dir="rtl">
<div class="flex-row">
<div class="companyInfo">
اسم الشركه
</div>
<div class="companyLogo">
<img src="https://internetmarketingteam.com/wp-content/uploads/2017/05/url-web-address-300x300.png" />
</div>
</div>
</div>
</body>