diff --git a/src/codehelp/templates/context_config.html b/src/codehelp/templates/context_config.html
index e1805d0..93abf06 100644
--- a/src/codehelp/templates/context_config.html
+++ b/src/codehelp/templates/context_config.html
@@ -1,7 +1,7 @@
 
 <div class="content">
   <h2 class="title is-size-4">Contexts</h2>
-  <p style="max-width: 50em">Contexts provide additional information to the LLM for each query a student makes.  You can have a single default context that is always used, or you can create separate contexts for individual assignments or modules.  If multiple contexts are available, students will be able to select from them when making queries.</p>
+  <p>Contexts provide additional information to the LLM for each query a student makes.  You can have a single default context that is always used, or you can create separate contexts for individual assignments or modules.  If multiple contexts are available, students will be able to select from them when making queries.</p>
   {% if contexts | length == 0 %}
     <p class="has-text-danger">While not strictly required, we recommend defining at least one context to specify the language(s), frameworks, and/or libraries in use in this class.</p>
   {% endif %}
@@ -89,7 +89,7 @@ <h2 class="title is-size-4">Contexts</h2>
       }));
     });
   </script>
-  <table class="table is-hoverable is-narrow" x-data="reorderable">
+  <table class="table is-hoverable is-narrow" style="width: auto; min-width: min(40em, 80%); margin: auto;" x-data="reorderable">
     <thead>
       <tr>
         <th class="p-0 has-text-centered has-text-grey" title="Reorder">
diff --git a/src/gened/templates/admin_main.html b/src/gened/templates/admin_main.html
index d9a688b..725281b 100644
--- a/src/gened/templates/admin_main.html
+++ b/src/gened/templates/admin_main.html
@@ -41,8 +41,8 @@
   {% endfor %}
   </div>
 
-  <div class="tbl_cols">
-    <div class="tbl_col" style="width: 50em;">
+  <div class="flex_items">
+    <div class="flex_item">
       <h1 class="is-size-3">Consumers <a class="button is-light is-link is-small mt-2" href="{{url_for('admin.consumer_new')}}">Create New</a></h1>
       {{ datatable(
           'consumers',
@@ -52,6 +52,8 @@ <h1 class="is-size-3">Consumers <a class="button is-light is-link is-small mt-2"
           link_template=filters.template_string('consumer') | safe,
           extra_links=[{'icon': "pencil", 'text': "Edit consumer", 'handler': "admin.consumer_form", 'param': "consumer_id"}],
       ) }}
+    </div>
+    <div class="flex_item">
       <h1 class="is-size-3">Classes</h1>
       {{ datatable(
           'classes',
@@ -61,6 +63,8 @@ <h1 class="is-size-3">Classes</h1>
           link_template=filters.template_string('class') | safe,
           extra_links=[{'icon': "admin", 'text': "Administer class", 'handler': "classes.switch_class_handler", 'param': "class_id"}],
       ) }}
+    </div>
+    <div class="flex_item">
       <h1 class="is-size-3">Users</h1>
       {{ datatable(
           'users',
@@ -69,6 +73,8 @@ <h1 class="is-size-3">Users</h1>
           link_col=0,
           link_template=filters.template_string('user') | safe,
       ) }}
+    </div>
+    <div class="flex_item">
       <h1 class="is-size-3">Roles</h1>
       {{ datatable(
           'roles',
@@ -78,7 +84,7 @@ <h1 class="is-size-3">Roles</h1>
           link_template=filters.template_string('role') | safe,
       ) }}
     </div>
-    <div class="tbl_col" style="width: 75em; flex-grow: 1;">
+    <div class="flex_item" style="flex-basis: max-content;">
       <h1 class="is-size-3">
         Queries
       </h1>
diff --git a/src/gened/templates/base.html b/src/gened/templates/base.html
index e32fb01..69fd06c 100644
--- a/src/gened/templates/base.html
+++ b/src/gened/templates/base.html
@@ -30,8 +30,8 @@
       main.site-content { flex: 1; } /* expand main content, push footer to bottom of page/viewport */
       span[title] { text-decoration: underline; text-decoration-style: dotted; }
       pre, .content pre { padding: 0.5rem 0.75rem; }
-      .tbl_cols { display: flex; gap: 2em; flex-wrap: wrap; }
-      .tbl_col { overflow: auto; }
+      .flex_items { display: flex; gap: 2em; flex-wrap: wrap; }
+      .flex_item { flex: 1 0 10em; min-width: min-content; overflow-auto; }
       dialog { border: none; background: none; }
       dialog::backdrop { background: #0009; backdrop-filter: blur(4px); }
       p.help-text { font-size: 85%; margin-bottom: 0.5em; opacity: 92%; }
diff --git a/src/gened/templates/instructor_class_config.html b/src/gened/templates/instructor_class_config.html
index 5a7c191..21c8f4b 100644
--- a/src/gened/templates/instructor_class_config.html
+++ b/src/gened/templates/instructor_class_config.html
@@ -13,25 +13,17 @@
   max-width: 1600px;
   margin: auto;
 }
-.conf_cols {
-  display: flex;
-  justify-content: center;
-  gap: 1em;
-}
+.item_sep { border: 2px solid #ccc; margin: 1em; }
 @media (max-width: 1200px) {
   /* flip to column below a given width (instead of just using flex-wrap) so any .sep item becomes a horizontal line */
-  .conf_cols { flex-direction: column; }
-}
-.conf_col_sep {
-  /* draw a line between config sections */
-  border: 2px solid #ccc;
+  .flex_items { flex-direction: column; }
 }
-.conf_col .field-body {
+.field-body {
   /* override bulma sizing for these forms */
   flex-grow: 2;
 }
-.conf_col input[type='checkbox'],
-.conf_col input[type='radio'] {
+input[type='checkbox'],
+input[type='radio'] {
   transform: scale(2.0);
   margin: 0.5rem;
   margin-top: 0.8rem;
@@ -39,8 +31,8 @@
 </style>
 <section class="section">
   <h1 class="title">Configure Class: {{ auth.cur_class.class_name }}</h1>
-  <div class="conf_cols">
-    <div class="conf_col">
+  <div class="flex_items" style="gap: 0;">
+    <div class="flex_item">
       <h2 class="title is-size-4">Access</h2>
       <form action="{{ url_for("instructor.set_user_class_setting") }}" method="post">
         <div class="field is-horizontal">
@@ -120,7 +112,7 @@ <h2 class="title is-size-4">Access</h2>
 
       {% if class_row['link_ident'] %}
       {# link_ident only in classes_user, so will only be set for user classes. #}
-      <div class="conf_col_sep mt-5"></div>
+      <div class="item_sep"></div>
 
       <h2 class="title is-size-4 mt-5">Language Model</h2>
       <form action="{{ url_for("instructor.set_user_class_setting") }}" method="post" x-data="{
@@ -228,50 +220,49 @@ <h2 class="title is-size-4 mt-5">Language Model</h2>
     </div>
 
     {% if extra_sections %}
-    <div class="conf_col_sep"></div>
-    <div class="conf_col">
+    <div class="item_sep"></div>
+    <div class="flex_item">
       {% for extra_section in extra_sections %}
         {{ extra_section }}
         {% if not loop.last %}
-          <div class="conf_col_sep mt-5 mb-5"></div>
+          <div class="item_sep"></div>
         {% endif %}
       {% endfor %}
     </div>
     {% endif %}
-</section>
 
-<div class="conf_col_sep m-5"></div>
+    <div class="item_sep" style="min-width: 90%;"></div>
 
-<section class="section">
-  <div class="box" style="max-width: 50em; margin: auto; border: 2px solid #f009; background: #ff000008">
-    <h2 class="title is-4 has-text-danger">Delete Class Data</h2>
-    <div class="content">
-      <p>This will:
-        <ul>
-          <li>Delete all user inputs made in this class</li>
-          <li>Remove all users from the class, including you</li>
-          <li>Delete class configuration data</li>
-          <li>Anonymize all class usage data</li>
-        </ul>
-      </p>
-      <p>Users will <em>not</em> be deleted, nor will their data in any other class they are enrolled in.</p>
-      {% if auth.user.auth_provider == 'lti' %}
-        <p>This class was accessed using a link from an LMS.  If that link still exists in the LMS after deleting the class data here, anyone following it will create a new, distinct instance of this class in CodeHelp (without any old data, but still with the ability to submit new queries).  To prevent that, remove the link from the LMS <em>before</em> deleting the class data here.</p>
-      {% endif %}
-      <p>Type "DELETE" in the text box to confirm you want to delete data for this class.</p>
-      <p class="has-text-danger"><strong class="has-text-danger">Warning:</strong> Deleting class data cannot be undone.</p>
-    </div>
-    <form method="POST" action="{{ url_for('instructor.delete_class') }}" class="field has-addons">
-      <input type="hidden" name="class_id", value="{{ auth.cur_class.class_id }}">
-      <div class="control">
-        <input class="input is-danger" type="text" name="confirm_delete" placeholder="Type DELETE to confirm">
-      </div>
-      <div class="control">
-        <button type="submit" class="button is-danger">
-          Delete Class Data
-        </button>
+    <div class="box" style="max-width: 50em; margin: auto; border: 2px solid #f009; background: #ff000008">
+      <h2 class="title is-4 has-text-danger">Delete Class Data</h2>
+      <div class="content">
+        <p>This will:
+          <ul>
+            <li>Delete all user inputs made in this class</li>
+            <li>Remove all users from the class, including you</li>
+            <li>Delete class configuration data</li>
+            <li>Anonymize all class usage data</li>
+          </ul>
+        </p>
+        <p>Users will <em>not</em> be deleted, nor will their data in any other class they are enrolled in.</p>
+        {% if auth.user.auth_provider == 'lti' %}
+          <p>This class was accessed using a link from an LMS.  If that link still exists in the LMS after deleting the class data here, anyone following it will create a new, distinct instance of this class in CodeHelp (without any old data, but still with the ability to submit new queries).  To prevent that, remove the link from the LMS <em>before</em> deleting the class data here.</p>
+        {% endif %}
+        <p>Type "DELETE" in the text box to confirm you want to delete data for this class.</p>
+        <p class="has-text-danger"><strong class="has-text-danger">Warning:</strong> Deleting class data cannot be undone.</p>
       </div>
-    </form>
+      <form method="POST" action="{{ url_for('instructor.delete_class') }}" class="field has-addons">
+        <input type="hidden" name="class_id", value="{{ auth.cur_class.class_id }}">
+        <div class="control">
+          <input class="input is-danger" type="text" name="confirm_delete" placeholder="Type DELETE to confirm">
+        </div>
+        <div class="control">
+          <button type="submit" class="button is-danger">
+            Delete Class Data
+          </button>
+        </div>
+      </form>
+    </div>
   </div>
 </section>