Position of modules in displayTop. How to css formatting?

[PanzerkampfPL]

Hi, I have a problem with modules all of them are side by side in a line. 
Screenshot:

 

I try to give the menu a line below and align the search box to the right but I don't know where I can edit it.  
If it change position of the modules in the back office in hook "displayTop" they are still in one line  

I would like to finally look like this:

[Inform-All]

I'm not sure if i understand what you are trying to achieve. 

Are you trying to have a dropdown of all the categories from your shop? 

[PanzerkampfPL]

I'm trying to change module position to make it look like below.  For some reason they line up one after other like in the first post screenshot
 

[Inform-All]

What hook did you put the menu now? 
And afterwards did you clean your cache? 

[PanzerkampfPL]

Default for menu module - displayTop.
I use "Prestashop Top horizontal menu with dropdowns" made by mypresta  (  @vekia  )

[Inform-All]

There are multiple solutions you could use... 
But if you undo all the edits you already made (including the edits to your search bar), it automatically uses the next row.

This might help: 

 

Edited April 14, 2020 by Inform-All (see edit history)

[Vac1cari]

CSS files in which all class names and animation names are scoped locally by default.