Question

我正在建立一个网站来托管我的博客和艺术作品。我试图将Twitter图标放在中心标题和屏幕的最左边。 Click here to see the top of the page that I'm referencing.

以下是各部分的代码。

CSS: https://pastebin.com/mqQUqxs1

HTML: https://pastebin.com/GA2bqBXG

Answer 1

这可能不是最好的方法，但你可以使用flexbox破解它。您需要空的span元素以确保按您希望的方式分配空间。像这样：

＆＃13;

header {
  background: #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

＆＃13;

<header>
  <span></span>
  <div id="twitter">
    <a href="twitter.com/wisopco"><img src="img\twitter.png" alt="Twitter" class="social"></a>
  </div>
  <h2 id="sultown" class="nav"> <a href="index.html"> SULTOWN </a></h1>
    <span></span>
    <span></span>
</header>
<form>
  <div id="search"><input type="text" name="search" placeholder="explore"></div id="search">
</form>

<a href="blogs/spectroscopy.html"><img src="img\spectroscopy.png" alt="Spectroscopy" class="media"></a>

＆＃13;

正如我所说，span只是间隔的守护者......

如何在不影响它们的情况下在另外两个块之间对齐图像？

1 个答案: