Module mit Css formatieren
Moderator: General Support Moderators
Forum rules
Forumregeln
Forumregeln
-
- Joomla! Apprentice
- Posts: 12
- Joined: Sun Dec 18, 2005 9:49 pm
Module mit Css formatieren
Ich habe ein neues Menu erstellt.
Dann erstellt Joomla automatisch ein Module.
Dieses Module hat die Parameter
Menu Class Suffix
Module Class Suffix
hier soll man CSS-Klassen eingeben können.
Ich habe in der Template_css.css
Eine CSS-Klasse und ID erstellt.
den Namen auch in Menu Class Suffix und Module Class Suffix eingetragen.
Passiert, aber nichts! Gebe ich es falsch ein?
Kann mir jemand bitte helfen.
Dann erstellt Joomla automatisch ein Module.
Dieses Module hat die Parameter
Menu Class Suffix
Module Class Suffix
hier soll man CSS-Klassen eingeben können.
Ich habe in der Template_css.css
Eine CSS-Klasse und ID erstellt.
den Namen auch in Menu Class Suffix und Module Class Suffix eingetragen.
Passiert, aber nichts! Gebe ich es falsch ein?
Kann mir jemand bitte helfen.
- stars
- Joomla! Enthusiast
- Posts: 116
- Joined: Mon Nov 07, 2005 12:57 pm
- Location: Munich
- Contact:
Re: Module mit Css formatieren
Versuche im Quellcode den Selektor mit dem von Dir definierten Suffix zu finden und dann kennst Du
auf welchen Bereich die CSS eine Auswirkung hat. Und dann probieren und testen ...
auf welchen Bereich die CSS eine Auswirkung hat. Und dann probieren und testen ...
stars
http://www.arandas.info
http://www.arandas.info
-
- Joomla! Apprentice
- Posts: 12
- Joined: Sun Dec 18, 2005 9:49 pm
Re: Module mit Css formatieren
Leider erstellt das Module "Tabellen"
wo drinne steht
und --> ist die Klasse "mainlevel"
In der CSS-Datei schreibe ich
td.mainlevel { text-algin:center } --> Geht nicht
Schreib ich td { text-algin:center } --> funktioniert es.
Kann es so aber nicht verwenden, weil es mir alle td auf center setzt.
Was kann jetzt noch machen?
wo drinne steht
und --> ist die Klasse "mainlevel"
In der CSS-Datei schreibe ich
td.mainlevel { text-algin:center } --> Geht nicht
Schreib ich td { text-algin:center } --> funktioniert es.
Kann es so aber nicht verwenden, weil es mir alle td auf center setzt.
Was kann jetzt noch machen?
- stars
- Joomla! Enthusiast
- Posts: 116
- Joined: Mon Nov 07, 2005 12:57 pm
- Location: Munich
- Contact:
Re: Module mit Css formatieren
Zunächst mal nur zur formalen Richtigkeit:bang wrote:
td.mainlevel { text-algin:center } --> Geht nicht
Schreib ich td { text-algin:center } --> funktioniert es.
1.) achte auf die richtige Schreibweise "align" und nicht algin
2.) in CSS muss jede Zeile mit einem Semikolon ";" abgeschlossen werden!
Nochmals das mit dem Suffix. Hast Du dies weiter verfolgt, diese werden von Dir in den Parametern der
Module definiert z.B. _xyz und dann findest Du im Quelltext z.B. mainlevel_xyz, das Du mit dem Stylesheet
ansprechen kannst.
stars
http://www.arandas.info
http://www.arandas.info
-
- Joomla! Apprentice
- Posts: 12
- Joined: Sun Dec 18, 2005 9:49 pm
Re: Module mit Css formatieren
Sorry mit align und den Semikonlons.
Das vor dem Suffix mainlevel steht habe
ich jetzt verstanden.
Ich kann das Module auch ansprechen.
Nur nicht mit den Parameter .mainlevel_Suffix {text-align:center;}.
Weil das Module als Tabelle ausgeben wird und
bei bla steht und derSuffix definition
steht im link Link.
Was machen? wollte ich nicht definieren, weil
alles was ist dann mittig steht.
Ratlosigkeit
Das vor dem Suffix mainlevel steht habe
ich jetzt verstanden.
Ich kann das Module auch ansprechen.
Nur nicht mit den Parameter .mainlevel_Suffix {text-align:center;}.
Weil das Module als Tabelle ausgeben wird und
bei bla steht und derSuffix definition
steht im link Link.
Was machen? wollte ich nicht definieren, weil
alles was ist dann mittig steht.
Ratlosigkeit
- stars
- Joomla! Enthusiast
- Posts: 116
- Joined: Mon Nov 07, 2005 12:57 pm
- Location: Munich
- Contact:
Re: Module mit Css formatieren
Was willst Du also genau bewirken mi der Formatierung?
Mit align=left wird nur festgelegt dass der Text linksbündig anfängt,
was bei Tabellen sinnvoll ist.
Dir bleiben aber noch einige andere Attribute zur Gestaltung
z.B. Rand (margin) und Auffüllung (padding):
Mit align=left wird nur festgelegt dass der Text linksbündig anfängt,
was bei Tabellen sinnvoll ist.
Dir bleiben aber noch einige andere Attribute zur Gestaltung
z.B. Rand (margin) und Auffüllung (padding):
Code: Select all
.mainlevel_xyz {
margin-right: 5px;
margin-left: 5px;
padding-right: 10px;
padding-left: 10px;
}
stars
http://www.arandas.info
http://www.arandas.info
-
- Joomla! Apprentice
- Posts: 12
- Joined: Sun Dec 18, 2005 9:49 pm
Re: Module mit Css formatieren
Ich möchte gerne, dass der Text in der Mitte steht.
Danke für die Hilfe
Danke für die Hilfe
- stars
- Joomla! Enthusiast
- Posts: 116
- Joined: Mon Nov 07, 2005 12:57 pm
- Location: Munich
- Contact:
Re: Module mit Css formatieren
Du kannst zwei Selektoren in CSS kombinieren und ihnen dann einen anderen
Wert zuweisen. z.B in dem HTML Beispiel ist als rot definiert dann aber
ist blau, weil zusammen als blau definiert werden:
Wert zuweisen. z.B in dem HTML Beispiel ist als rot definiert dann aber
ist blau, weil zusammen als blau definiert werden:
Code: Select all
<html>
<head>
<title>CSS Demo</title>
<style type="text/css">
<!--
b {
color: red;
}
p b {
color: blue;
}
-->
</style>
</head>
<body>
<b>Farbe Rot</b>
<p>Farbe Schwarz <b> Farbe Blau</b></p>
</body>
</html>
stars
http://www.arandas.info
http://www.arandas.info
-
- Joomla! Apprentice
- Posts: 12
- Joined: Sun Dec 18, 2005 9:49 pm
Re: Module mit Css formatieren
Super! Danke für den Tipp.
Ich versuche mich gerade am Design.
Ich weiß es passt jetzt nicht direkt hierein.
Habe hier wohl ein Css-Expert (stars ).
Deshalb frage ich einfach mal.
Ist es Sinnig ein Design ohne Tabellenstruktur
zu machen?
Weil ich bin ganz schön am kämpfen.
Und bin Css-Anfänger!!!
Ich versuche mich gerade am Design.
Ich weiß es passt jetzt nicht direkt hierein.
Habe hier wohl ein Css-Expert (stars ).
Deshalb frage ich einfach mal.
Ist es Sinnig ein Design ohne Tabellenstruktur
zu machen?
Weil ich bin ganz schön am kämpfen.
Und bin Css-Anfänger!!!
- stars
- Joomla! Enthusiast
- Posts: 116
- Joined: Mon Nov 07, 2005 12:57 pm
- Location: Munich
- Contact:
Re: Module mit Css formatieren
Die moderne und elegantere Variante besteht nicht in den Tabellen sondern in der Verwendung von Containernbang wrote: Ist es Sinnig ein Design ohne Tabellenstruktur
zu machen?
also den .. Tags. Ich habe mich in letzter Zeit viel damit herumgeschlagen und für eine einfache Lösungen
ist dies auch recht brauchbar. Bei komplexeren Projekten ist jedoch das Verhalten der Browser nicht mehr nachzuvollziehen.
Vermutlich sind das noch die Startprobleme der Browser. Lässt sich aber weitgehend durch work-around und trixen lösen.
Zur Verzweiflung treibt eiem jedoch die fehlende kompatibilität zwischen den Browsern vorallem Firefox und MS Internet Explorer
haben unterschiedliche Definitionen für das das Boxen-Modell. Hier gibt es zwar gut dokumentierte Hacks aber das sind Klimmzüge, die
einem das Leben noch zusätzlich erschweren. Daher bin ich in letzter Zeit wieder zu den Tabellen zurückgekehrt.
Da Joomla alles in Tabellenform ausgiebt führt dies schnell zu Tabelle in Tabelle in Tabelle etc. und Keiner blickt mehr durch
inklusive die Browser.
Daher mein Tip packe alles in eine einzige Tabelle - ohne Ausnahme -, damit hier nicht schon die Tabellen-Konfusion anfängt.
Hier gebe ich Dir auch ein kleines Beispiel:
und hier die Tabellen-Datei als HTML Code
Code: Select all
<html>
<head>
<title>Tabellen für Joomla-Template</title>
<link href="css_datei.css" rel="stylesheet" type="text/css">
</head>
<body>
<table width="680" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="160" rowspan="2" valign="top" id="logo">Logo</td>
<td height="60" valign="top" id="bild">Bild</td>
</tr>
<tr>
<td height="30" valign="top" id="pathway">Pathway</td>
</tr>
<tr>
<td height="290" valign="top" id="menue">Menue</td>
<td valign="top" id="mitte">Mitte</td>
</tr>
<tr>
<td height="30" colspan="2" valign="top" id="footer">Footer</td>
</tr>
</table>
</body>
</html>
HTML - Datei erkannt wird.
Code: Select all
#logo {
background: #0099CC;
}
#bild {
background: #6633FF;
}
#pathway {
background: #FFFF00;
}
#menue {
background: #00FF99;
}
#mitte {
background: #FFCCCC;
}
#footer {
background: #00FFFF;
}
and you are on the road ...
Peter
stars
http://www.arandas.info
http://www.arandas.info
- stars
- Joomla! Enthusiast
- Posts: 116
- Joined: Mon Nov 07, 2005 12:57 pm
- Location: Munich
- Contact:
Re: Module mit Css formatieren
Hallo bang,
Mir kommt gerade die Idee, wenn Du möchtest, poste ich Dir auch eine einfache
Variante mit Container! Du kannst dann mit beiden experimentieren.
Mir kommt gerade die Idee, wenn Du möchtest, poste ich Dir auch eine einfache
Variante mit Container! Du kannst dann mit beiden experimentieren.
stars
http://www.arandas.info
http://www.arandas.info
-
- Joomla! Apprentice
- Posts: 12
- Joined: Sun Dec 18, 2005 9:49 pm
Re: Module mit Css formatieren
Ich möchte gerne ein Vorschlag mit div.
Kann man
diese Struktur in div hinbekommen?
Also drei spaltig geht ja. habe aber leider noch nicht
die Möglichkeit in 3 Zeilen zuteilen.
Danke auch für den Css-Experte.
Ich möchte ungerne mit Tabellen arbeiten.
Super Forum!
Kann man
diese Struktur in div hinbekommen?
Also drei spaltig geht ja. habe aber leider noch nicht
die Möglichkeit in 3 Zeilen zuteilen.
Danke auch für den Css-Experte.
Ich möchte ungerne mit Tabellen arbeiten.
Super Forum!
- stars
- Joomla! Enthusiast
- Posts: 116
- Joined: Mon Nov 07, 2005 12:57 pm
- Location: Munich
- Contact:
Re: Module mit Css formatieren
Hier der Code für das gleiche Template wie oben abgebildet jedoch nun als DIV Variante.
Vorweg sieht man hier gut schon den Unterschied zwischen den Browsern Firefox und MS Internet Explorer:
Und hier der Quellcode der DIV-Container Variante:
Die CSS-Datei ist fast die gleiche es sind noch diei Div-Selektoren Container und Central
hinzugekommen. Und einige height und width Definitionen sind statt im Table-Tag in der
CSS-Datei.
Viel Spass beim hacken.
Servus
Peter
Vorweg sieht man hier gut schon den Unterschied zwischen den Browsern Firefox und MS Internet Explorer:
Und hier der Quellcode der DIV-Container Variante:
Code: Select all
<html>
<head>
<title>DIV-Container für Joomla Template</title>
<link href="css_datei.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="container">
<div id="logo">
logo
</div>
<div id="bild">
bild
</div>
<div id="pathway">
pathway
</div>
<div id="central">
<div id="menue">
menue
</div>
<div id="mitte">
mitte
</div>
</div>
<div id="footer">
footer
</div>
</div>
</body>
</html>
Die CSS-Datei ist fast die gleiche es sind noch diei Div-Selektoren Container und Central
hinzugekommen. Und einige height und width Definitionen sind statt im Table-Tag in der
CSS-Datei.
Code: Select all
#container {
width: 680px;
}
#central {
height: 290px;
}
#logo {
background: #0099CC;
float: left;
height: 90px;
width: 160px;
}
#bild {
background: #6633FF;
height: 60px;
}
#pathway {
background: #FFFF00;
height: 30px;
}
#menue {
background: #00FF99;
width: 160px;
float: left;
height: 100%;
}
#mitte {
background: #FFCCCC;
height: 100%;
}
#footer {
background: #00FFFF;
clear: left;
}
</div>
Servus
Peter
stars
http://www.arandas.info
http://www.arandas.info
-
- Joomla! Apprentice
- Posts: 12
- Joined: Sun Dec 18, 2005 9:49 pm
Re: Module mit Css formatieren
Vielen Dank Stars!
Servus
Servus
-
- Joomla! Fledgling
- Posts: 3
- Joined: Thu Aug 16, 2007 8:14 am
Re: Module mit Css formatieren
Hallo,
bin neu in der Szene. Blicke noch nicht so richtig durch.
Warum wird mir die Zelle nicht mit gelber Hintergrundfarbe angezeigt?
danke den Hotlinern, die mir auf die Sprünge helfen!!
dummy
#logo {background: #fefece;}
bin neu in der Szene. Blicke noch nicht so richtig durch.
Warum wird mir die Zelle nicht mit gelber Hintergrundfarbe angezeigt?
danke den Hotlinern, die mir auf die Sprünge helfen!!
dummy
#logo {background: #fefece;}
-
- Joomla! Fledgling
- Posts: 3
- Joined: Thu Aug 16, 2007 8:14 am
Re: Module mit Css formatieren
Kann der Fehler schon im Link der HTML liegen?
Die Datei tabelle.css wird erst gar nicht angesprochen. Warum der Link da nicht hinführt verstehe ich nicht. Stimmt vielleicht die Syntax nicht?
Gruß
Udo
Die Datei tabelle.css wird erst gar nicht angesprochen. Warum der Link da nicht hinführt verstehe ich nicht. Stimmt vielleicht die Syntax nicht?
Gruß
Udo
- StephanK
- Joomla! Explorer
- Posts: 292
- Joined: Fri Aug 19, 2005 2:10 pm
- Location: Germany - Eppelheim
- Contact:
Re: Module mit Css formatieren
Hi Udo,
Zunächst mal versuche mit /> abzuschliessen.
Und dann glaube ich das es eine URL sein muss, kein Dateilink. Da bin ich mir allerdings nicht ganz sicher, ein Versuch ist es aber sicherlich wert.
Zunächst mal versuche mit /> abzuschliessen.
Und dann glaube ich das es eine URL sein muss, kein Dateilink. Da bin ich mir allerdings nicht ganz sicher, ein Versuch ist es aber sicherlich wert.