StartseiteTeammitglieder online
Regeln und nützliche Hinweise
Neueste Themen
» Das Plauderforum ist zurück!von Eto Heute um 17:59
» Style-Wechsel funktioniert nicht mehr
von Miho Heute um 11:05
» Profil in beiträgen nur im blog deaktivieren.
von Skouliki Heute um 10:16
» [Invision] Editor über den Bildrand ziehbar + Schriftgrößenproblem
von Skouliki Mi 20 Nov 2024 - 8:06
» Passwort für meinen Adminbereich vergessen.
von Joost Sa 9 Nov 2024 - 10:13
» [Invision] Signatur wird nicht immer eingefügt
von Skouliki Mo 4 Nov 2024 - 16:33
» [Invision] Schriftgröße Navigationsleiste, Links und Forenbeschreibungen
von Skouliki So 27 Okt 2024 - 13:29
» [Invision] Transparent Logohintergrund/Struktur
von Joost So 27 Okt 2024 - 12:58
» png wird im servimg in ein jpg umgewandelt
von Skouliki Mi 23 Okt 2024 - 20:26
» Passwort Vergessen (SilentHowl)
von Joost Do 17 Okt 2024 - 17:14
» [Invision] Hintergrundbild fixieren
von Skouliki Mo 14 Okt 2024 - 11:30
» Paßwort vergessen
von Joost So 13 Okt 2024 - 17:58
» Anti-Spam-Prüfung
von Hana19 Sa 12 Okt 2024 - 16:59
» Private Nachrichten bleiben im Postausgang hängen
von Skouliki Fr 11 Okt 2024 - 11:11
» [phpBB3] Mittelteil des Forums verschoben
von Eto Mo 7 Okt 2024 - 20:50
» [phpBB3] Farbpalette ändern
von Skouliki Mo 7 Okt 2024 - 10:08
» [Klassische Version] Account löschen
von Joost Sa 5 Okt 2024 - 21:05
» Chatbox einloggen nicht möglich
von Joost So 29 Sep 2024 - 8:01
Beiträge mit den meisten Reaktionen des Monats
» Beitrag von Alastor in [Invision] Transparent Logohintergrund/Struktur ( 2 )
» Beitrag von Agorass in Passwort für meinen Adminbereich vergessen.
( 2 )
» Beitrag von Keks in [phpBB2] Unterforen Nebeneinander
( 1 )
» Beitrag von Alastor in [Invision] Schriftgröße Navigationsleiste, Links und Forenbeschreibungen
( 1 )
[phpBB2] ChangeOnglet/Tabelle mit Tabs auf ganze Forenbreite
3 verfasser
Das Forum der Foren :: Hilfe und Unterstützung :: Probleme mit Scripten oder Codes :: Probleme mit Scripten oder Codes - Archiv
Seite 1 von 1 • Teilen
[phpBB2] ChangeOnglet/Tabelle mit Tabs auf ganze Forenbreite
von NekoAkina Sa 7 Feb 2015 - 8:41
Hallöchen!
Es geht mal wieder um dieses Forum hier. x3 Ich bin gerade dabei die Headertabelle zu justieren und habe mich dabei für eine Tabelle mit Tabs entschieden. Mein Problem ist nun allerdings, wie ich diese Tabelle auf die gesamte Forenbreite bekomme. Der Abstand, den die Tabelle auf der linken Seite zum Rand hat, stört mich doch wirklich sehr. Ich hoffe, jemand kann mir helfen!
Vielen Dank schon mal!
Es geht mal wieder um dieses Forum hier. x3 Ich bin gerade dabei die Headertabelle zu justieren und habe mich dabei für eine Tabelle mit Tabs entschieden. Mein Problem ist nun allerdings, wie ich diese Tabelle auf die gesamte Forenbreite bekomme. Der Abstand, den die Tabelle auf der linken Seite zum Rand hat, stört mich doch wirklich sehr. Ich hoffe, jemand kann mir helfen!
- meine Codes:
- HTML
- Code:
<link href="http://fonts.googleapis.com/css?family=UnifrakturMaguntia" rel="stylesheet" type="text/css" />
<div id="mes_onglets">
<ul>
<li onclick="changeOnglet(this);" id="o_1" class="mon_onglet_selected">
<span style="letter-spacing: -2px; font-family: UnifrakturMaguntia; font-size: 20px;">Important</span>
</li>
<li onclick="changeOnglet(this);" id="o_2" class="mon_onglet">
<span style="letter-spacing: -2px; font-family: UnifrakturMaguntia; font-size: 20px;">Up to date</span>
</li>
<li onclick="changeOnglet(this);" id="o_3" class="mon_onglet">
<span style="letter-spacing: -2px; font-family: UnifrakturMaguntia; font-size: 20px;">Wanted</span>
</li>
<li onclick="changeOnglet(this);" id="o_4" class="mon_onglet">
<span style="letter-spacing: -2px; font-family: UnifrakturMaguntia; font-size: 20px;">Other stuff</span>
</li>
<div class="clear">
<div id="mes_contenus">
<div id="co_1" class="mon_contenu">
<table style="width: 100%;">
<tbody>
<tr>
<td style="width: 50%;" valign="top">
<div style="margin: auto; width: 100%; text-align: center;">
Bla
<center>
Bla
</center>
</div>
</td>
<td style="width: 50%;" valign="top">
<div style="margin: auto; width: 100%; text-align: center;">
bla
</div>
<center>
bla
</center>
</td>
</tr>
</tbody>
</table>
</div>
<div style="display: none;" id="co_2" class="mon_contenu">
<table style="width: 100%;">
<tbody>
<tr>
<td style="width: 50%;" valign="top">
<div style="margin: auto; width: 100%; text-align: center;">
bla
<center>
<div style="padding: 5px; width: 300px; height: 150px; line-height: 2em; overflow: auto;">
<strong><span style="text-decoration: underline;">news</span></strong><br />bla<br />
</div><strong> </strong>
</center><strong> </strong>
</div>
</td>
<td style="width: 50%;" valign="top">
<div style="margin: auto; width: 100%; text-align: center;">
bla
<center>
bla
</center>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div style="display: none;" id="co_3" class="mon_contenu">
<table style="width: 100%;">
<tbody>
<tr>
<td style="width: 50%;" valign="top">
<div style="margin: auto; width: 100%; text-align: center;">
bla
<center>
bla
</center>
</div>
</td>
<td style="width: 50%;" valign="top">
<div style="margin: auto; width: 100%; text-align: center;">
bla
</div>
bla
</td>
</tr>
</tbody>
</table>
</div>
<div style="display: none;" id="co_4" class="mon_contenu">
<table style="width: 100%;">
<tbody>
<tr>
<td style="width: 50%;" valign="top">
<div style="margin: auto; width: 100%; text-align: center;">
bla
<center>
bla
</center>
</div>
</td>
<td style="width: 50%;" valign="top">
<div style="margin: auto; width: 100%; text-align: center;">
bla
<marquee direction="up">
gesuche!
</marquee>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</ul>
</div>
CSS- Code:
/*changeOnglet*/
.mon_onglet{
float: left;
padding: 2px 10px;
margin-right: 0px;
color: #5C523C;
background: #f5f5f5
border: 4px double #5e574c;
margin-bottom: -1px;
list-style: none;
font-family: georgia;
font-size: 15px;
}
.mon_onglet:hover{
background: #f5f5f5;
}
.mon_onglet_selected{
float: left;
padding: 2px 10px;
margin-right: 0px;
color: #5C523C;
background: #f5f5f5;
border-top: 4px double #5e574c;
border-right: 4px double #5e574c;
border-left: 4px double #5e574c;
border-bottom: 4px double #5e574c;
margin-bottom: -1px;
list-style: none;
font-family: georgia;
font-size: 15px;}
.clear{
clear: both;
}
.mon_contenu{
color: #5C523C;
background: #f5f5f5;
border: 2px dashed #5e574c;
padding: 10px;
line-height: normal;
font-size: 12px;}
#mes_contenus, #mes_onglets{
width: 700px;
margin: auto;}
Java Script- Code:
function changeOnglet(_this){
var getOnglets = document.getElementById('mes_onglets').getElementsByTagName('li');
for(var i = 0; i < getOnglets.length; i++){
if(getOnglets[i].id){
if(getOnglets[i].id == _this.id){
getOnglets[i].className = 'mon_onglet_selected';
document.getElementById('c' + _this.id).style.display = 'block';
}
else{
getOnglets[i].className = 'mon_onglet';
document.getElementById('c' + getOnglets[i].id).style.display = 'none';
}
}
}
}
Vielen Dank schon mal!
Zuletzt von NekoAkina am Sa 7 Feb 2015 - 16:31 bearbeitet; insgesamt 1-mal bearbeitet
NekoAkina- Lehrling
- Beiträge : 14
Anmeldedatum : 11.07.14
Re: [phpBB2] ChangeOnglet/Tabelle mit Tabs auf ganze Forenbreite
von inde Sa 7 Feb 2015 - 12:36
Hallo NekoAkina,
schaust Du Dir bitte einmal Dein CSS an, insbesondere die Abstände?
Besser vielleicht so? Dabei habe ich auch die Weite noch ein wenig verändert.
Hilft Dir das weiter?
LG inde
EDIT: Auch ein positiver oder negativer Wert wäre denkbar.
schaust Du Dir bitte einmal Dein CSS an, insbesondere die Abstände?
- Code:
#mes_contenus, #mes_onglets{
width: 700px;
margin: auto;}
Besser vielleicht so? Dabei habe ich auch die Weite noch ein wenig verändert.
- Code:
#mes_contenus, #mes_onglets {
margin: auto auto auto 0;
width: 710px;
}
Hilft Dir das weiter?
LG inde
EDIT: Auch ein positiver oder negativer Wert wäre denkbar.
Zuletzt von inde am Sa 7 Feb 2015 - 12:55 bearbeitet; insgesamt 2-mal bearbeitet (Grund : EDIT:)
inde- Admin a.D.
-
Beiträge : 5658
Anmeldedatum : 20.10.11
Re: [phpBB2] ChangeOnglet/Tabelle mit Tabs auf ganze Forenbreite
von NekoAkina Sa 7 Feb 2015 - 15:28
Vielen Dank für deine Hilfe x3
Allerdings hat es nur dafür gesorgt, dass die Tabelle dann rechts über steht. ._.
Es sollte sich allerdings mehr in Richtung links bewegen owo
Allerdings hat es nur dafür gesorgt, dass die Tabelle dann rechts über steht. ._.
Es sollte sich allerdings mehr in Richtung links bewegen owo
NekoAkina- Lehrling
- Beiträge : 14
Anmeldedatum : 11.07.14
Re: [phpBB2] ChangeOnglet/Tabelle mit Tabs auf ganze Forenbreite
von Günther Sa 7 Feb 2015 - 16:20
Hallo @NekoAkina,
bitte füge in dein CSS-Stylesheet unter
AB -> Anzeige -> Bilder & Farben -> Farben -> Reiter "CSS Stylesheet"
folgenden Code ein:
bitte füge in dein CSS-Stylesheet unter
AB -> Anzeige -> Bilder & Farben -> Farben -> Reiter "CSS Stylesheet"
folgenden Code ein:
- Code:
#mes_onglets ul {
padding: 0;
}
Günther- Admin a.D.
- Beiträge : 15349
Anmeldedatum : 16.07.08
Re: [phpBB2] ChangeOnglet/Tabelle mit Tabs auf ganze Forenbreite
von NekoAkina Sa 7 Feb 2015 - 16:30
Ah vielen lieben Dank ^w^
Du bist echt eine super große Hilfe gewesen, hat gut geklappt.
Du bist echt eine super große Hilfe gewesen, hat gut geklappt.
NekoAkina- Lehrling
- Beiträge : 14
Anmeldedatum : 11.07.14
Re: [phpBB2] ChangeOnglet/Tabelle mit Tabs auf ganze Forenbreite
von Günther Sa 7 Feb 2015 - 16:33
Freut mich. 
-closed-
-closed-
Günther- Admin a.D.
- Beiträge : 15349
Anmeldedatum : 16.07.08
Ähnliche Themen» [phpBB2] ChangeOnglet / Tabelle mit Tabs - Nächster Reiter öffnet sich nicht
» [phpBB2] Tabs - ChangeOnglet
» Tabelle in der Startseitennachricht (organic tabs)
» [phpBB2] ChangeOnglet Spalten - 4 Reiter gehen auf, 4 nicht
» [phpBB2] Slideshow + Textarea mit Tabs zentriert?
» [phpBB2] Tabs - ChangeOnglet
» Tabelle in der Startseitennachricht (organic tabs)
» [phpBB2] ChangeOnglet Spalten - 4 Reiter gehen auf, 4 nicht
» [phpBB2] Slideshow + Textarea mit Tabs zentriert?
Das Forum der Foren :: Hilfe und Unterstützung :: Probleme mit Scripten oder Codes :: Probleme mit Scripten oder Codes - Archiv
Seite 1 von 1
Befugnisse in diesem Forum
Sie können in diesem Forum nicht antworten
