# Lock An Element To Its Parent With Absolute Positioning

The next option for the CSS position property is absolute, which locks the element in place relative to its parent container.

<style>
  #searchbar {
    position: absolute;
    top: 50px;
    right: 50px;

  }
  section {
    position: relative;
  }
</style>
<body>
  <h1>Welcome!</h1>
  <section>
    <form id="searchbar">
      <label for="search">Search:</label>
      <input type="search" id="search" name="search">
      <input type="submit" name="submit" value="Go!">
    </form>
  </section>
</body>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

source (opens new window)