Streaming live at 10am (PST)

How to position two elements on top of each and keep them responsive

Screenshot (2)

Hey, Im just looking for some advice on how to properly place the image above the font and keep it responsive no matter the size of the screen. Just need some direction on layout and position.

Hey @dalton_dom, the behaviour can be achieved with position attributes for the elements. Since you have not provided a read-only link, I will assume the structure to have this working for you.

Let’s say this is your navigation structure:

••• Nav Links
•••••• nav__link_1   Works
•••••• nav__link_2   Projects
•••••••••  image
•••••• nav__link_3.  Contact
  1. Select your nav__link's and set their position as relative from the styles pane on the right hand side.
  2. Select your image and set its position as absolute. Since you set the parent, i.e. the nav__link as relative, the absolute positioning of the image will be in relation to its parent.
  3. You can now adjust positioning of the image within the absolute positioning options and I would recommend to use %'s as they would be consistent positioning in different viewports rather than px's