Positioning elements in a row.?

Question

css

https://jsfiddle.net/8xzy5afL/2/
Both columns need to be on the same line, regardless of the size of each. But the div with them(.secondMenu) doesn't stretch no matter what I do.
What is strange - if you change its positioning from absoluteto fixed- everything works as it should. What am I doing wrong?
(HTML should not be touched)

Answer 1

The code is not valid, <div>cannot be a direct child of <ul>.

Answer 2

I don’t know how true and beautiful it is, but it seems to work as it should - https://jsfiddle.net/8xzy5afL/3/
#query and #data instead of float -> display: inline-block;
and like this

#wrap2 .secondMenu ul {
        max-width: 49%;
        margin: 0;
        padding: 0;
      }

so that these two blocks are not too wide