Как отобразить элементы в одну строчку?

Question

Элементы не отображаются в одну строчку

div.header_image {
  margin: 0;
  padding: 0;
  background-color: #333333;
  overflow: auto;
  width: 100%;
  display: inline-block;
}

<div class="header_image">
  <h1 class="site_title">Test</h1>
  <a href="index.php?name=main.php">Main</a>
  <a href="index.php?name=contacts.php">Contacts</a>
</div>

Answer 1

Несколько вариантов, как расположить элементы в одну строку:

inline-block:

body * {
    display: inline-block;
}

<body>
    <div>ads</div>
    <h1>qwe</h1>
    <a href="d" #>d</a>
</body>

flexbox:

body {
  display: flex;
}

<body>
  <div>ads</div>
  <h1>qwe</h1>
  <a href="d" #>d</a>
</body>

grid:

body {
  display: grid;
  grid-template-columns: auto auto auto;
}

<body>
  <div>ads</div>
  <h1>qwe</h1>
  <a href="d" #>d</a>
</body>

БЛОГ НА HUSL

Как отобразить элементы в одну строчку?

Ответы (1 шт):