[phpBB2]Die "Tabelle", die sich nicht centern lies

Seid gegrüßt, liebes Supportteam!
Ich habe nach diesem Tuto aus dem englischen Support in meinem Testforum die Foren- und Kategorienanzeige geändert. Da ich den Forentitel auch im "Tab" stehen haben und die Spalte "neuster Beitrag" entfernen wollte, bearbeitete ich das Template index_box aus dem Tuto ein bisschen:

Code:

    <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
      <tr>
          <td valign="bottom">
            <!-- BEGIN switch_user_logged_in -->
            <span class="gensmall">{LAST_VISIT_DATE}

            {CURRENT_TIME}

            </span>
            <!-- END switch_user_logged_in -->
            <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
          </td>
          <td class="gensmall" align="right" valign="bottom">
            <!-- BEGIN switch_user_logged_in -->
            <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a>

            <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>

            <!-- END switch_user_logged_in -->
            <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
          </td>
      </tr>
    </table>
    <!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
      <tr>
          <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
         
      </tr>
      <!-- END tablehead -->
      <!-- BEGIN cathead -->
      <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
          <!-- END inc -->
          <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
            <h{catrow.cathead.LEVEL} class="hierarchy">
                <span class="cattitle">
                  <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
                </span>
            </h{catrow.cathead.LEVEL}>
          </td>
          <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
      </tr>
      <!-- END cathead -->
      <!-- BEGIN forumrow -->
      <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
          <!-- END inc -->
          <td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
            <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
          </td>
          <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
       
    <!---- MODIFICATIONS MADE BY THE FRENCH SUPPORT FORUM ---->

            <div class="forum-stats">{catrow.forumrow.POSTS} Beiträge in {catrow.forumrow.TOPICS} Thread/s.</div>
<table border="0" width="80%" class="Forenbeschreibung"><tr><td><center> <h{catrow.forumrow.LEVEL} class="hierarchy"><span class="forumlink">
  <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></span> </h{catrow.forumrow.LEVEL}></center>

        <center><div class="forum-description">
    <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
          </div></center></td></tr></table>
          <div class="forum-sousforum">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
            <span class="gensmall">
                <!-- BEGIN switch_moderators_links -->
                {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                <!-- END switch_moderators_links -->

            </span>
          </td>
          <!-- BEGIN forum_link_no -->
       

    <!---- END OF MODIFICATIONS MADE BY THE FRENCH SUPPORT FORUM ---->

          <!-- END forum_link_no -->
          <!-- BEGIN forum_link -->
          <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td>
          <!-- END forum_link -->
      </tr>
      <!-- END forumrow -->
      <!-- BEGIN catfoot -->
      <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
          <!-- END inc -->
          <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
      </tr>
      <!-- END catfoot -->
      <!-- BEGIN tablefoot -->
    </table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

Auch den CSS-Code bearbeitete ich:

Code:

 
    /*--- This part corresponds at the forum description ---*/
    .Forenbeschreibung {
  margin: auto;
          padding: 10px;
          color: #000000;
          width: 80%;
          border: 1px solid #0067B0;
    -moz-border-radius: 14px;
          -webkit-border-radius: 14px;
          border-radius: 14px;
  box-shadow:0 0 8px #021678;
  -webkit-box-shadow: 0 0 8px #021678;
  -moz-box-shadow: 0 0 8px #021678;
  font-size: 12px;
  background-color:#0095FF;}
 
    /*--- This part corresponds to "X messages in X topics" ---*/
    .forum-stats {
          -moz-border-radius-topleft: 20px;
          -moz-border-radius-topright: 20px;
          -webkit-border-top-right-radius: 20px;
          -webkit-border-top-left-radius: 20px;
          border-top-right-radius: 20px;
          border-top-left-radius: 20px;
          border-bottom: 0 none !important;
          border-left: 1px solid #0067B0;
          border-right: 1px solid #0067B0;
          border-top: 1px solid #0067B0;
          color: #000000;
          font-size: 11px;
          font-style: italic;
          height: 14px;
          left: 280px;
          padding: 3px;
          position: relative;
          text-align: center;
          width: 200px;
  background-color: #0095FF;
  box-shadow:0 0 8px #021678;
  -webkit-box-shadow: 0 0 8px #021678;
  -moz-box-shadow: 0 0 8px #021678;
    }

    /*--- This part corresponds to the subforums display ---*/
    .forum-sousforum {
          display: none;
    }
/*---END of the modifications "display categories as tabs"---*/
.row1, .row3 {
 background-color: transparent !important;
}

Ich würde gerne diese "Tabelle" zentrieren (am Screenshot rot umrandet):

Ich weis aber nicht, wie ich das machen soll.
Ich habe bereits im CSS folgendes versucht:

/*--- This part corresponds to "X messages in X topics" ---*/
.forum-stats {
[...]
height: 14px;
left: 280px;
padding: 3px;
position: relative;
text-align: center;
width: 200px;
[...]
}

Das fett markierte habe ich durch "center" ersetzt -daraufhin wurde die "Tabelle" ganz links angezeigt - so als ob ich ein "aling:left" angegeben hätte. Genauso wirkte sich auch ein hinzugefügtes "align:center" aus. Auch eine Markierung als !important brachte nichts. Daraufhin entfernte ich die Anweisung "left: 280px" - keine Besserung

Auch ein hinzugefügtes algin="center" im Template in der div-Class-Zuweisung half nichts:

<div class="forum-stats" align="center">{catrow.forumrow.POSTS} Beiträge in {catrow.forumrow.TOPICS} Thread/s.</div>

Und jetzt ist meine Frage, wie ich diese "Tabelle" zentrieren kann

Das Tutorial stammt aus dem englischen Support, daher bitte ich dich auch dementsprechend dort nachzufragen.

Vielleicht solltest du dich auch einfach selbst ein wenig mit der Materie beschäftigen;)

Ich dachte, dass vielleicht Günther weis, wie ich diese Tabelle zentriere.

Da mein Englisch nicht extrem gut ist , würde ich vielleicht nicht alles verstehen,w as mir im englischen Support geantwortet wird...

Wenn du die Sprache nicht verstehst, dann versuche doch auch nicht solche Tutorials umzusetzen.

Das Thema ist frei, falls dir jemand helfen möchte.

So wie ich es in deinem Testforum sehe, hast du es ja nun hinbekommen.
Dann können wir das Thema schliessen?

Bei mir wird die Tabelle immer noch nicht in der Mitte über den Forentiteln angezeigt - demnach ist hier nicht erledigt
Mein Browser ist Firefox 17

Schade, aber bei mir sind die Überschriften mittig zu sehen.
Aber das kann Zufall sein. Du musst dich mal mit der Angabe der Position auseinander setzen. Auch die anderen Angaben im CSS die mit der Position zu tun haben musst du dabei beachten.

Welche Überschriften meinst du
Ich meine die Angaben "X Beiträge in X Threads" - das ist bei mir auch nach mehrmaliger Löschung des Caches nicht miittig über den Titeln der Unterforen.
Da du auch Firefox verwendest, wird es wohl nicht am Browser liegen.

Edit: Es wird an der Bildschirmauflösung liegen. Ich habe 1600x1900 (Widescreen) und sehe die besagte Tabelle deutlich nach links verschoben. Am iPod touch jedoch sehe ich die Tabelle fast genau mittig, da dort die Auflösung wesentlich geringer ist.
Ich würde die Tabelle aber gerne so zentrieren, dass sie unaängig von der Bildschirmauflösung mittig ist.

Hallo,

da das "Frei"-Icon gesetzt ist, hinterlasse ich auch noch einen Tipp.
Aus dem CSS-Eintrag entfernst du die rot markierten Werte:

.forum-stats {
background-color: #00B3FF;
border-bottom: 0 none !important;
border-left: 1px solid #0067B0;
border-right: 1px solid #0067B0;
border-top: 1px solid #0067B0;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
color: #000000;
font-size: 11px;
font-style: italic;
height: 14px;
left: 280px;
padding: 3px;
position: relative;
text-align: center;
width: 200px;
}

Dadurch wird das Element nicht mehr positioniert, sondern linksbündig mit der festgelegten Breite von 200px angezeigt.
Das ist ein guter Ausgangszustand für folgenden Gedanken: Wie kannst du ein Blockelement standardkonform über CSS zentrieren?
Die Lösung lautet ganz einfach, die Abstände von rechts und links (margin) auf einen individuellen, gleichmäßig berechneten Wert zu setzen (auto).

Das bedeutet, dass du folgende Eigenschaft in der Zuweisung ergänzt:

Code:

margin: auto;

Das ist schon alles Nötige, um zu einer schönen Zentrierung zu gelangen:


Sieh dir mal an, wie man in solchen Fällen einen Gedankengang führt, denn in der Zukunft solltest du dich selbst daran versuchen.

Liebe Grüße
Günther

Dankesehr, Günther
Ich hatte wohl ein Brett vorm Kopf

Edit: Jetzt gibt es schon das nächste Problem:

Als ich nun das Templaate und das CSS aus dem Testforum in mein Forum einsetzte, wird der Hintergrund um den Forennamen und die Forenbeschreibung in der falschen Farbe angezeigt. Eigentlich sollte der gesamte "Tab" die Hintergrundfabrbe #00B3FF haben...

Bitte.

Die Frage mit der Hintergrundfarbe solltest du selbst klären können, wenn du dir mal die ".Forenbeschreibung"-Zuweisungen im Testforum ansiehst und dann mit jener in deinem echten Forum vergleichst. Dann siehst du sofort, wo sich der Unterschied befindet.

Da es nun auch im Hauptforum Funktioniert, ist hier nun zu.