Alinear el contenido de la tabla para que coincida con el contacto árabe
Necesito alinear el contenido de la tabla para que coincida con el contacto árabe y que la fila comience en el lado derecho de la página. Logré alinear la imagen hacia el lado izquierdo, pero la información de la empresa en sí no estará alineada hacia la derecha. el texto en sí está alineado a la derecha pero el conjunto está en el lado izquierdo junto a la imagen.
.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>Expandir fragmento
Intenté tener cada os col-span=4, intenté darles un ancho del 50% cada uno pero ninguno de estos funciona
Aceptado
Parece que estás utilizando una tabla con fines de diseño. Eso sería un mal uso del elemento de la tabla y dificultaría la consecución de su objetivo.
Esta es mi mejor suposición sobre lo que busca al usar flexbox , una función de diseño moderna.
.flexRow {
display: flex; /* row by default */
}
.companyInfo {
background-color: red;
flex: auto; /* take up extra width */
justify-content: start; /* row axis */
align-items: center; /* cross axis */
}
.companyLogo {
background-color: yellow;
}<body>
<div dir="rtl" class="flexRow">
<div class="companyInfo flexRow">
اسم الشركه
</div>
<div class="companyLogo">
<img src="https://internetmarketingteam.com/wp-content/uploads/2017/05/url-web-address-300x300.png" />
</div>
</div>
</body>Expandir fragmento
