default theme, avoid main content jumping around by setting max. width

5 files changed, 12 insertions, 12 deletions

diff --git a/themes/default/stylesheet.css b/themes/default/stylesheet.css
index c57c8a9..eae8f4a 100644
--- a/themes/default/stylesheet.css
+++ b/themes/default/stylesheet.css
@@ -133,23 +133,23 @@ a.thumblink:hover {
 #single {

    padding:                10px;

    display:                table;

-   margin-left:            10px;

-   margin-right:           10px;

    table-layout:           fixed;

    border:                 hidden;

    border-spacing:         10px;

    border-collapse:        separate;

+   margin-left:            auto;

+   margin-right:           auto;

 }

 

 table.matrix {

    padding:                10px;

    display:                table;

-   margin-left:            5px;

-   margin-right:           10px;

    table-layout:           fixed;

    border-style:           hidden;

    border-spacing:         10px;

    border-collapse:        separate;

+   margin-left:            auto;

+   margin-right:           auto;

 }

 

 td.thumb {

diff --git a/themes/default/templates/index.tpl b/themes/default/templates/index.tpl
index 72a5ef0..d07554e 100644
--- a/themes/default/templates/index.tpl
+++ b/themes/default/templates/index.tpl
@@ -32,7 +32,7 @@
       </tr>
      </table>
     </td>
-    <td class="content">
+    <td class="content" style="width: 100%;">
      <div id="content">
       {include file="welcome.tpl"}
      </div>
diff --git a/themes/default/templates/photo_index.tpl b/themes/default/templates/photo_index.tpl
index 462163d..9ceb0dc 100644
--- a/themes/default/templates/photo_index.tpl
+++ b/themes/default/templates/photo_index.tpl
@@ -44,7 +44,7 @@
   </td>
  </tr>
  <tr>
-  <td colspan="3">
+  <td colspan="3" style="width: 100%;">
    <div id="adinfo"></div>
    <table class="matrix" id="matrix">
    {section name="row" loop=$rows step=1}
diff --git a/themes/default/templates/single_photo.tpl b/themes/default/templates/single_photo.tpl
index 22d8ca2..d80a006 100644
--- a/themes/default/templates/single_photo.tpl
+++ b/themes/default/templates/single_photo.tpl
@@ -1,5 +1,5 @@
 <!-- Single photo -->
-<table>
+<table style="width: 100%;">
  <tr>
   <td class="content_title" style="text-align: left;">
    <b>Photo {$image_name}</b><br />
@@ -26,9 +26,9 @@
   </td>
  </tr>
  <tr>
-  <td>
+  <td style="width: 100%;">
    <div id='single'>
-   <table>
+   <table class="matrix">
     <tr>
      <td colspan="3">
      { if $next_url == "" }
@@ -68,7 +68,7 @@
    </table>
    </div>
   </td>
-  <td style="width: 150px; padding-top: 20px;">
+  <td style="width: 150px; padding-top: 20px; padding-right: 20px">
    <div id="photo_details">
    { if $ExifMadeWith }
    <u><img src="resources/camera.png" alt="camera icon" />&nbsp;Image taken with:</u><br />
diff --git a/themes/default/templates/welcome.tpl b/themes/default/templates/welcome.tpl
index 9845755..fa8d80e 100644
--- a/themes/default/templates/welcome.tpl
+++ b/themes/default/templates/welcome.tpl
@@ -1,5 +1,5 @@
 <!-- welcome -->
-<table>
+<table style="width: 100%;">
  <tr>
   <td class="index_header" style="text-align: left;">
    phpfspot welcomes you to a dynamic photo gallery for <a href="http://f-spot.org" target="_blank">F-Spot</a><br />
@@ -7,7 +7,7 @@
  </tr>
  <tr>
   <td>
-   <div id='single'>
+   <div style="padding: 10px; display: table; margin-left: 10px; margin-right: 10px; table-layout: fixed; border: hidden; border-spacing: 10px; border-collapse: separate;">
    <table>
     <tr>
      <td>