英文:
How do I space multiple buttons in HTML?
问题
Sure, here are the translated HTML code parts:
<a href="https://github.com/drippy-cat" class="button primary">GitHub</a>
<a href="https://discord.gg/xvTyBgn6F2" class="button primary">Discord</a>
<a href="https://app.daily.dev/drippy-cat" class="button primary">daily.dev</a>
Please let me know if you need any further assistance.
英文:
<a href="https://github.com/drippy-cat" class="button primary">GitHub</a>
<a href="https://discord.gg/xvTyBgn6F2" class="button primary">Discord</a>
<a href="https://app.daily.dev/drippy-cat" class="button primary">daily.dev</a>
I have been working on my website. This code is located in index.html of this repository. I have been trying to create under the "social" tab of the page. However, it ends up looking like the screenshot I attached. Is there a way to space out the buttons more and have them in a grid pattern? Thanks!
答案1
得分: 0
以下是翻译好的代码部分：
<div class="button-container">
<a href="https://github.com/drippy-cat" class="button primary">GitHub</a>
<a href="https://discord.gg/xvTyBgn6F2" class="button primary">Discord</a>
<a href="https://app.daily.dev/drippy-cat" class="button primary">daily.dev</a>
</div>
<style>
.button-container {
display: flex;
}
.button-container a.button {
margin-right: 15px;
}
</style>
英文:
A quick solution is to add a wrapper and specify the margin of the buttons.
<div class="button-container">
<a href="https://github.com/drippy-cat" class="button primary">GitHub</a>
<a href="https://discord.gg/xvTyBgn6F2" class="button primary">Discord</a>
<a href="https://app.daily.dev/drippy-cat" class="button primary">daily.dev</a>
</div>
<style>
.button-container {
display: flex;
}
.button-container a.button {
margin-right: 15px;
}
</style>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论