better r6662

diff --git a/web/index.html b/web/index.html
index d4e0adacd9d8f3a98e16b7156a5c2312f475dfe1..5893ec1a01e194242cfd130b2d97a9bed507cc65 100755 (executable)
--- a/web/index.html
+++ b/web/index.html
@@ -68,7 +68,7 @@
                        
                        <div class="inspector_container" id="inspector_tab_info_container">
                                <div class="inspector_group">
-                                       <strong>Transfer Information</strong>
+                                       <div class="inspector_group_label">Information</div>
                                        <div class="inspector_row">
                                                <div class="inspector_label">Tracker:</div>
                                                <div id="torrent_inspector_tracker"></div>
@@ -88,7 +88,7 @@
                                </div><!-- class="inspector_group"-->
                                
                                <div class="inspector_group">
-                                       <strong>Created By</strong>
+                                       <div class="inspector_group_label">Created By</div>
                                        <div class="inspector_row">
                                                <div class="inspector_label">Creator:</div>
                                                <div id="torrent_inspector_creator">N/A</div>
@@ -103,7 +103,7 @@
                        <div style="display:none;" class="inspector_container" id="inspector_tab_activity_container">
 
                                <div class="inspector_group">
-                                       <strong>Activity</strong>
+                                       <div class="inspector_group_label">Activity</div>
                                        <div class="inspector_row">
                                                <div class="inspector_label">State:</div>
                                                <div id="torrent_inspector_state">N/A</div>
@@ -147,7 +147,7 @@
                                </div><!-- class="inspector_group"-->
                                
                                <div class="inspector_group">
-                                       <strong>Peers</strong>
+                                       <div class="inspector_group_label">Peers</div>
                                        <div class="inspector_row">
                                                <div class="inspector_label">UL To:</div>
                                                <div id="torrent_inspector_upload_to">N/A</div>

diff --git a/web/stylesheets/common.css b/web/stylesheets/common.css
index 92e373019693943f4fe22e5d91cad2160336dd88..3e659ac98aa64b2ae08a51f2c489a86dac8c1a4e 100644 (file)
--- a/web/stylesheets/common.css
+++ b/web/stylesheets/common.css
@@ -494,34 +494,27 @@ div#torrent_inspector {
        z-index: 2;
        text-align: left;
 }
-
 div#torrent_inspector #torrent_inspector_name {
-       font-size: 1.3em;
        margin: 0;
-       word-wrap: break-word;
        overflow: hidden;
 }
-
 div#torrent_inspector #torrent_inspector_size {
        font-size: 1.2em;
        margin: 3;
        display: block;
        padding-top: 2px;
 }
-
 div#inspector_header {
        clear: both;
        padding-top: 10px;
        padding-left: 10px;
        padding-right: 10px;
 }
-
 div#inspector_tabs {
        margin: 0 auto;
        padding-top: 10px;
        width: 140px;
 }
-
 .inspector_tab {
        float: left;
        background: transparent url('../images/buttons/tab_backgrounds.png') left -1px repeat-x;
@@ -530,24 +523,22 @@ div#inspector_tabs {
        padding: 3px 15px; /* 3px == ((bg image height - fg image height) / 2) */
        cursor: pointer;
 }
-
 #inspector_tabs > .selected {
-       background-position: left -26px;
+       background-position: left -26px; /* the highlighted part of the image */
 }
-
 .inspector_container {
-       padding-top: 10px;
-       padding-bottom: 5px;
-       margin: 5px 10px;
+       margin: 10px;
+       width: 330px; /* inspector_width==350 - ((margin==10)*2) */
 }
-
 .inspector_group {
+       display: table;
+       width: 100%;
        border-top: 1px solid #888;
-       margin: 8px 0px;
-       padding: 8px 0px;
+       margin: 10px 0px;
+       padding: 10px 0px;
 }
-
 .inspector_group_label {
+       display: table-header-group;
        font-weight: bold;
 }
 .inspector_row {
@@ -555,12 +546,12 @@ div#inspector_tabs {
 }
 .inspector_row > .inspector_label {
        display: table-cell;
-       padding-left: 10px;
+       width: 100px; /* this + the next 230 == inspector_container_with */
 }
 .inspector_row > div {
+       display: table-cell;
        padding-top: 10px;
-       padding-left: 10px;
-       word-wrap: break-word;
+       width: 230px; /* inspector_container_width==330 - inspector_label_width==100 */
 }
 
 /*--------------------------------------