[WBB2.x] Header Template, tabellen ändern! - Foren-, Blog- und Content-Managementsysteme

SevenofNine

Foren Gott

Dabei seit: 30.10.2002

Beiträge: 5 219

1

Dienstag, 17. Januar 2006, 13:10

Header Template, tabellen ändern!

Also ich bekomme es mal wieder nicht hin, ich glaube ich geb es auf und mach wieder nur noch meine PC sachen, schrauben etc. ich habe die Schnautze voll.

Aber kommen wir zum eigentlichen:
Ich habe einen Header und dort drunter kommt dan die Navileiste, man hat ja je nach dem was für eine Berechtigung man im Forum hat mehr oder weniger viele Button dort stehen.
Wie muss die Tabelle aussehen das es so wird das ich eine linke und rechte abschluss Grafik dort habe (im Paket hier heisst es links.gif und rechts1.gif) dazwischen dann die Navibutton Zentriert, mittig also. Natürlich je nach benutzerrecht mehr oder weniger Button.

Ich dachte mir gut dann muss die Tabelle also als Hintergrund eben ein Bild bekommen in der Art der Navibutton,(also eine Grafik 1px breit, ich würde dann die leer.gif einfach auf 1px bringen und dann als Hintergrund setzen).
Nur ich schaff es nicht, also den HTML teil, nun müsst ihr wieder mal ran und mir helfen.

Als Anlage eine rar mit dem wie es zur zeit ist.

Gruß

Seven

»SevenofNine« hat folgende Datei angehängt:

header.rar (35,75 kB - 23 mal heruntergeladen - zuletzt: 9. Januar 2012, 01:16)

Bevor du hier Fragen stellst, lese alle Dokumentationen und klicke die folgenden Links um mehr zu erfahren
WMW Forensuche,
WMW F.A.Q. und/oder
Allgemeine suche

Dr. z0idb3rg

Kaiser

Dabei seit: 06.01.2003

Beiträge: 1 373

2

Dienstag, 17. Januar 2006, 14:51

Könntest du mal schnell visualisieren, wie du es gerne hättest? Habe nämlich gerade Probleme deinen Text gedanklich abzuarbeiten bzw bin zu faul

Wenn es zu umständlich wäre, würde ich mich nachher aber auch so nochmal dran versuchen...

[_______|button||button||button|_______] <-- so oder?

[ und ] (links & rechts.gif) sollen fest seitlich angebracht sein
_ (leer.gif) soll wegen den ladezeiten als backgroundimage über die gesamte breit gehen
und jeder |button| soll zentriert in der zeile stehen

Aber dann verstehe ich dein Problem nicht ganz .. bin aber gerade auch nicht so ganz auf der Höhe

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »Dr. z0idb3rg« (17. Januar 2006, 14:54)

SevenofNine

Foren Gott

Dabei seit: 30.10.2002

Beiträge: 5 219

3

Dienstag, 17. Januar 2006, 14:56

Also ich hätte es gerne so:

Wie in der Anlage..... gut da fehlt nun der Spiel button , der muss auch rein ... nur wenn ich nun wie in dem Bild nen leer gif weg nehme dann ist die tabelle nimmer 100% sondern kleiner, ich möchte gerne die navleiste in der Breite 100% haben, wenn aber dann der eine oder andere Button wegfällt , weil zum Beispiel Admin usw. dann soll die Tabelle immer noch 100% sein nur das erreiche ich ja nur wenn ich ein Tabellen hintergrund habe, eben das Leer gif, das kann ja auch nur 1px breit sein.
Und es muss halt links und rechts aussen je die abschlussgrafik stehen, fest und unverrückt!
Nun verstanden?

Gruß

Seven

Edit:

Bild vergessen!

Edit2:

mein Problem ist einfach das es nicht passt...... ich bekomme nicht die links und rechts gif fest an den anfan bzw. das ende. die leer.gif´s sollen raus , dafür denke ich ist ein Tabellen hintergrund besser, weil wenn dann eben die breite der verwendetetn Navibutton nicht ausreicht dann sehe ich ja den Hintergrund der tabelle.
Ich kann es nicht besser erklären.

Schau dir doch einfach mal die html datei an die ich in das archiv gepackt habe an... dann denke ich verstehst du was ich meine, mit einer 1024x768px auflöung.

Edit3:

So nun aber ,

siehe Bild... so soll es werden..... Tabelle, links und rechts sind gif´s die sollen fest sein, dazwischen dann die Button , mittig..... egal was kommt.
So nun habe ich ja dann noch freien raum (noch sind dort die leer.gif, die sollen raus! Weil wenn es ja mal ein button mehr wird dann würde ja alles verzehrt werden.).... dort sehe ich dann ja den Tabellen hintergrund (wenn ich die leer.gif entferne!) den füllen wir mit einem Bild, 1px Breit und zwar in dem farbverlauf wie das leer.gif.
So nun kann ich es nicht mehr anders erklären.

»SevenofNine« hat folgendes Bild angehängt:

Bevor du hier Fragen stellst, lese alle Dokumentationen und klicke die folgenden Links um mehr zu erfahren
WMW Forensuche,
WMW F.A.Q. und/oder
Allgemeine suche

Dieser Beitrag wurde bereits 4 mal editiert, zuletzt von »SevenofNine« (17. Januar 2006, 15:40)

Dr. z0idb3rg

Kaiser

Dabei seit: 06.01.2003

Beiträge: 1 373

4

Dienstag, 17. Januar 2006, 20:39

Japp hatte es ja dann auch verstanden - musste nur in die Mittagsschule

Quellcode

<table style="width:{$style['tableoutwidth']}" cellpadding="{$style['tableoutcellpadding']}" cellspacing="{$style['tableoutcellspacing']}" align="center" border="{$style['tableoutborder']}" class="tableoutborder">
 <tr>
  <td class="mainpage" align="center">
   <table style="width:100%" border="0" cellspacing="0" cellpadding="0">
    <tr> 
     <td colspan="3" class="logobackground" align="center"><if($style['logoimage']!="")><then><a href="index.php{$SID_ARG_1ST}"><img src="{$style['logoimage']}" border="0" alt="$master_board_name" title="$master_board_name" /></a></then></if></td>
    </tr>
    <tr>
     <td style="text-align:left"><img src="links.gif"></td>
     <td style="width:100%; background-image:url(leer.gif); text-align:center"><span class="smallfont"><if($wbbuserdata['userid'])><then><a href="usercp.php{$SID_ARG_1ST}"><img src="top_usercp.gif" border="0" alt="{$lang->items['LANG_GLOBAL_USERCP']}" title="{$lang->items['LANG_GLOBAL_USERCP']}"></a><a href="pms.php{$SID_ARG_1ST}"><img src="top_pms.gif" border="0" alt="{$lang->items['LANG_GLOBAL_PMS']}" title="{$lang->items['LANG_GLOBAL_PMS']}"></a></then><else><a href="register.php{$SID_ARG_1ST}"><img src="top_register.gif" border="0" alt="{$lang->items['LANG_GLOBAL_REGISTER']}" title="{$lang->items['LANG_GLOBAL_REGISTER']}"></a></else></if><a href="calendar.php{$SID_ARG_1ST}"><img src="top_calendar.gif" border="0" alt="{$lang->items['LANG_GLOBAL_CALENDAR']}" title="{$lang->items['LANG_GLOBAL_CALENDAR']}"></a><a href="memberslist.php{$SID_ARG_1ST}"><img src="top_members.gif" border="0" alt="{$lang->items['LANG_GLOBAL_MEMBERSLIST']}" title="{$lang->items['LANG_GLOBAL_MEMBERSLIST']}"></a><a href="team.php{$SID_ARG_1ST}"><img src="top_team.gif" border="0" alt="{$lang->items['LANG_GLOBAL_TEAM']}" title="{$lang->items['LANG_GLOBAL_TEAM']}"></a><a href="search.php{$SID_ARG_1ST}"><img src="top_search.gif" border="0" alt="{$lang->items['LANG_GLOBAL_SEARCH']}" title="{$lang->items['LANG_GLOBAL_SEARCH']}"></a><a href="misc.php?action=faq{$SID_ARG_2ND}"><img src="top_faq.gif" border="0" alt="{$lang->items['LANG_GLOBAL_FAQ']}" title="{$lang->items['LANG_GLOBAL_FAQ']}"></a><if($wbbuserdata['a_can_use_acp']==1 && $wbbuserdata['a_acp_or_mcp']==1)><then><a href="acp/index.php" target="_blank"><img src="top_acp.gif" border="0" alt="{$lang->items['LANG_GLOBAL_ACP']}" title="{$lang->items['LANG_GLOBAL_ACP']}"></a></then></if><if($wbbuserdata['a_can_use_acp']==1 && $wbbuserdata['a_acp_or_mcp']==0)><then><a href="acp/index.php" target="_blank"><img src="top_modcp.gif" border="0" alt="{$lang->items['LANG_GLOBAL_MODCP']}" title="{$lang->items['LANG_GLOBAL_MODCP']}"></a></then></if><a href="index.php{$SID_ARG_1ST}"><img src="top_start.gif" border="0" alt="{$lang->items['LANG_GLOBAL_TOINDEX']}" title="{$lang->items['LANG_GLOBAL_TOINDEX']}"></a><if($wbbuserdata['userid'])><then><a href="kniffel_play.php"><img src="top_spiel.gif" border="0"></a></then></if></span></td>
     <td style="text-align:right"><img src="rechts1.gif"></td>
    </tr>     
   </table><br>

Änderungen habe ich rot eingefärbt - zufrieden?

[edit] Ach verdammt - BBCode geht da drin ja gar nicht ... wie denn auch :rolleyes:

... naja - die relevanten Änderungen wirst du bei einem Abgleich der Quelltexte bestimmt feststellen.

[edit] Die "leer.gif" musst du jetzt nur noch auf 1px Breite "resizen" ;>

[edit] War noch ein Denkfehler drin - jetzt sollte alles stimmen.

Gruß

Dieser Beitrag wurde bereits 5 mal editiert, zuletzt von »Dr. z0idb3rg« (17. Januar 2006, 21:25)

SevenofNine

Foren Gott

Dabei seit: 30.10.2002

Beiträge: 5 219

5

Dienstag, 17. Januar 2006, 21:37

zufrieden? ja fast, weil so weit war ich auch schon einmal .....

Schaust du dir die Grafik an .... das klappt nicht, die Navibutton sind nicht mittig.

Ich kam an dem Punkt nicht weiter.

Gruß

Seven

»SevenofNine« hat folgendes Bild angehängt:

Bevor du hier Fragen stellst, lese alle Dokumentationen und klicke die folgenden Links um mehr zu erfahren
WMW Forensuche,
WMW F.A.Q. und/oder
Allgemeine suche

Dr. z0idb3rg

Kaiser

Dabei seit: 06.01.2003

Beiträge: 1 373

6

Dienstag, 17. Januar 2006, 21:50

Habe den Quelltext nochmal überarbeiten müssen weil mir mein Denkfehler selber aufgefallen ist - schau dir doch bitte nochmal die korrigierte Version an und prüfe, ob es nun klappt.

Gruß

SevenofNine

Foren Gott

Dabei seit: 30.10.2002

Beiträge: 5 219

7

Dienstag, 17. Januar 2006, 22:26

juuuuuuuhuuuuuu, alles bestens nun, habe noch mal eine kleine änderung gemacht , nun geht es,

<table style="width:100%" border="0" cellspacing="0" cellpadding="0">

<td style="width:100%; background-image:url(leer.gif);

Was rot ist jeweils durch die Boardangaben ersetzt , also durch
width:{$style['tableoutwidth']} und schon hat e sso geklappt wie ich es wollte , vorher war es so , das die navitabelle Breiter war als die Headergrafik (die ist 900px breit), und mit deinem Code war dann die navi volle Bildschirmbreite.

Nur sage mir doch bitte mal wo mein fehler war.... ich blick es nicht.

Gruß

Seven

Bevor du hier Fragen stellst, lese alle Dokumentationen und klicke die folgenden Links um mehr zu erfahren
WMW Forensuche,
WMW F.A.Q. und/oder
Allgemeine suche

Dr. z0idb3rg

Kaiser

Dabei seit: 06.01.2003

Beiträge: 1 373

8

Dienstag, 17. Januar 2006, 22:37

Also die Idee war folgende:

In der zweiten Tabelle (table) musste man einfach in der ersten Reihe (tr) per "colspan" festlegen, dass die Tabelle eigentlich 3 Spalten (td) haben soll, diese Zelle jedoch über alle drei laufen soll (Zellen verbinden) ... da man nicht einfach in jeder Reihe unabhängig voneinander beliebig viele Spalten benutzen kann ist dieser Befehl notwendig um jeweils die Anzahl der noch verbleibenden Spalten "auszufüllen". Drei Spalten einzuführen wurde notwendig, da du ja drei verschiedene Ausrichtungen (left, center, right) haben wolltest und dies meines Wissens bei Tabellen nur so möglich ist. Der mittleren Spalte in der zweiten Reihe wurde dann auch 100%ige Breite zugewiesen, damit das Backgroundbild über die gesamte Breite läuft und die Lücken füllt.

Hoffe das war jetzt einigermaßen verständlich und von der Erklärung her nicht falsch

Gruß

Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von »Dr. z0idb3rg« (17. Januar 2006, 22:39)