У меня есть простой блок текста, разделяющий контейнер display: flex
с тегом <a>
.
К сожалению, упаковка немного странная, как будто «истинная» ширина тега <a>
не обрабатывается как таковая или как будто она имеет ширину 0 (судя по тому, как она расположена).
Есть ли какие-то стили, которые я могу применить к тегам <a>
, чтобы сделать их более «текстовыми»?
body {
font-size: 32px;
}
body > .container {
display: flex;
flex-flow: column nowrap;
justify-content: flex-start;
align-items: center;
}
body > .container > .foot {
flex: 1 0 100%;
background-color: grey;
display: flex;
flex-flow: column nowrap;
justify-content: center;
align-items: center;
}
body > .container > .foot > .content {
flex: 1 0 70%;
width: 50%;
height: 350px;
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
align-items: center;
align-content: center;
text-align: center;
}
<div class='container'>
<div class='foot'>
<div class='content'>
We'll be back up shortly. We are undergoing a scheduled maintenance. Apologies for the inconvenience. Check <a href='https://status.mywebsite.com'>https://status.mywebsite.com </a> for updates.
</div>
</div>
</div>