change an element order in the document ?

[Hema]

how to make an element in a container, comes after another different container, without using units to not make it fixed?

for example:

- if i have an element inside the <header> element, and i want it to appear after all of the elements in the document?

[dsonesuk]

IF you mean taking that element outside the header element without using position fixed, then no! It can't be done with CSS, only javascript. CSS can change the order of child sibling elements using display: flex; and order: though.

[Hema]

i need to do that for screen reader, because it reads the elements in the order, so i want the element to be put in the bottom while it's a child to the header

if i do that using a fixed unit it will not be the last if another element added to the middle of the body 

[dsonesuk]

IT will still! Be child of header if using position fixed for that element and force it down to bottom using bottom: left: or right: properties and order won't change.

[Hema]

yeah that's right but, if that webpage is an interactive one and other contents are added to it, here the <main> element has to not take the full hight px

you know i have been testing screen reader on mobile & pc and found out that using ( details ) element for containing elements and navigating using 

screen reader is the best way so i may go with, that thank you so much🥰