Top-right of its section? But its located in center... I dont understand

Tell us what’s happening:
Hi all.

Here the question says.
“Lock the #searchbar element to the top-right of its section parent by declaring its position as absolute . Give it top and right offsets of 50 pixels each.”

The test tells me to place the seachbar to the “TOP-RIGHT”, but when i place the codes its goes to the center of the section.

Therefore what is meant by the question? It made me confused.

Thanks

Your code so far


<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>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36.

Challenge: Lock an Element to its Parent with Absolute Positioning

Link to the challenge:

It looks like it goes to the center of the section when your window (where you see the result) isn’t open on 100%. Change the size of that window and you’ll that it places search bar in top-right of the section.

1 Like

Thanks :smiley: :smiley: :smiley: