From 97f8f1b89e82407bea129c46b2fd73a67ed58c41 Mon Sep 17 00:00:00 2001
From: Henrik Giesel <hengiesel@gmail.com>
Date: Fri, 22 Jan 2021 11:37:11 +0100
Subject: [PATCH] Switch from floating windows and clearfix to flex and
 justify-content: space-between

---
 qt/aqt/data/web/css/editor.scss |  6 +++++-
 qt/aqt/editor.py                | 12 +++++-------
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/qt/aqt/data/web/css/editor.scss b/qt/aqt/data/web/css/editor.scss
index dc65c3e6a..11bf745dc 100644
--- a/qt/aqt/data/web/css/editor.scss
+++ b/qt/aqt/data/web/css/editor.scss
@@ -33,7 +33,11 @@ body {
     margin: 0;
 }
 
-#topbutsOuter {
+#topbuts {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+
     position: sticky;
     top: 0;
     left: 0;
diff --git a/qt/aqt/editor.py b/qt/aqt/editor.py
index 3abe0ca70..c7d9e54b0 100644
--- a/qt/aqt/editor.py
+++ b/qt/aqt/editor.py
@@ -72,13 +72,11 @@ audio = (
 _html = """
 <style>
 html { background: %s; }
-#topbutsOuter { background: %s; }
+#topbuts { background: %s; }
 </style>
 <div>
-    <div id="topbutsOuter">
-        <div id="topbuts" class="clearfix">
-    %s
-        </div>
+    <div id="topbuts">
+        %s
     </div>
     <div id="fields">
     </div>
@@ -206,10 +204,10 @@ class Editor:
         righttopbtns = runFilter("setupEditorButtons", righttopbtns, self)
 
         topbuts = """
-            <div id="topbutsleft" style="float:left;">
+            <div id="topbutsleft">
                 %(leftbts)s
             </div>
-            <div id="topbutsright" style="float:right;">
+            <div id="topbutsright">
                 %(rightbts)s
             </div>
         """ % dict(