Autor |
Nachricht |
bender007
Threadersteller
Dabei seit: 19.09.2008
Ort: -
Alter: 40
Geschlecht:
|
Verfasst Do 20.11.2008 22:13
Titel [CSS] Text Stylen (no div, no class etc) |
|
|
Hi,
ich habe ein etwas verrücktes Problem und zwar habe ich ein Newsmodul in Joomla was mir von einer Kategorie den Title und den Introtext anzeigt.
Title ist klar z.B. 2.märz und der folgende Introtext ist nicht mit einem (a oder p) oder sonst etwas umschlossen, so ist es mir nicht möglich den Text der dem Title folgt zu stylen. Der Title läßt sich über a stylen da er auch ein Link ist.
ok etwas schwer zu erklären hier mal der Code:
Code: |
<div class="gn_static_1">
<ul>
<li>
<a href="/index.php?option=com_content&view=article&id=.....=3&lang=de">März.2008</a>
<br/>
Weiter hohe...
</li>
</ul>
</div>
|
Also im <li> befinden sich der <a href> der den Titel mit dem Link umschließt und der nachfolgende Introtext(Weiter hohe...)
Den Title März.2008 kann ich Problemlos stylen aber den nachfolgenden dynamisch erstellen text nicht (Weiter hohe...).
Die Idee war vor den Titel eine Grafik zu setzten die sich dann beim rüber Hovern über den Titel verändert und dafür muss ich den dynamischen Text (Weiter hohe...) etwas vorrücken so ca. 10px. Ich könnte auch die Grafik in den <ul> setzten aber dann funzt der Hover effekt nicht mehr.
Ist es möglich das zu umgehen? (Der html code ist natürlich dynamisch.. Joomla halt )
P.S.
Hier ein kleiner auszug aus einer der vielen .php Dateien:
Code: | <div class="gn_static_<?php echo $globalnews_id; ?>">
<ul>
<li><?php echo modGlobalNewsHelper::renderGN_Content($params,$item); ?></li>
</ul>
</div>
|
Das Problem ist das der Title zusammen mit dem Introtext ausgegeben wird wenn ich das Splitten könnte wäre es no problemo ..nur zur Info.
Vielen Dank bender
Zuletzt bearbeitet von bender007 am Do 20.11.2008 22:26, insgesamt 2-mal bearbeitet
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Do 20.11.2008 22:25
Titel
|
|
|
Du kannst doch auf den Inhalt des li Elementes getrennt von dem des Hyperlinks stylen:
Code: | div.gn_static_1 ul li {
...
}
div.gn_static_1 ul li a {
...
} |
|
|
|
|
|
Anzeige
|
|
|
bender007
Threadersteller
Dabei seit: 19.09.2008
Ort: -
Alter: 40
Geschlecht:
|
Verfasst Do 20.11.2008 22:35
Titel
|
|
|
hi, danke für deine Antwort.
Aber jedesmal wenn ich das ul li element style verändert er auch das a element da ja <a> und der Introtext beide in li stehen... oder sehe ich das falsch?
Code: |
.gn_static_1 ul li {
list-style-type:none;
padding: 0 0 0 30px;
}
.gn_static_1 ul li a {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-weight: bold;
font-size: 14px;
text-transform: uppercase;
color:#274471;
padding: 0 0 0 15px;
background-image: url(../../../images/let.gif);
background-repeat: no-repeat;
background-position: 0px 2px;
} |
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Do 20.11.2008 22:46
Titel
|
|
|
Ich bin mir nicht sicher ob ich die korrekt verstehe, aber ich schätze du willst etwas ähnliches erreichen:
Code: | ul li {
padding-left: 10px;
}
ul li a {
margin-left: -10px;
} |
oder
Code: | ul li {
padding-left: 10px;
}
ul li a {
position: relative;
left: -10px;
} |
Zuletzt bearbeitet von m am Do 20.11.2008 22:47, insgesamt 1-mal bearbeitet
|
|
|
|
|
bender007
Threadersteller
Dabei seit: 19.09.2008
Ort: -
Alter: 40
Geschlecht:
|
Verfasst Do 20.11.2008 23:01
Titel
|
|
|
ja so etwas in der art.
ich möchte das <a> nicht gleichzeitig mit dem introtext beginnt sondern sagen wir 15 px vorher damit ich das bild einfügen kann damit <a> und der Text bündig abschließen und in <a> noch ein bild reinpasst.
Hab mal schnell n Bild gemalt das wir uns nicht missverstehen:
[/img]
März.2008 und Weiter hohe... sollen bündig abschließen aber in a soll noch ein bild (davor)..
P.S ich prbier deinen Code mal aus scheint zu funzen ..meld mich gleich nochmal
Zuletzt bearbeitet von bender007 am Do 20.11.2008 23:05, insgesamt 1-mal bearbeitet
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Do 20.11.2008 23:05
Titel
|
|
|
Ja ist ja kein Problem, du kannst innerhalb des Hyperlinks auch noch eine Grafik einfügen.
Die Werte 10px und -10px tauscht du dann mit der Breite der Grafik aus...
|
|
|
|
|
bender007
Threadersteller
Dabei seit: 19.09.2008
Ort: -
Alter: 40
Geschlecht:
|
Verfasst Do 20.11.2008 23:09
Titel
|
|
|
Ich probier mal etwas rum aber ich rall das grad absolut net
Meld mich gleich nochmal
.. Bei deiner -15px methode muss ich doch das Bild in den Quellcode schreiben oder?
Weil wenn ich dem Bild einen Minus wert gebe ist es weg (ich denke mal das es von dem li überdeckt wird)
und wie schon gesagt der Title = März2008 und der Text sollen bündig miteinander abschließen und das Bild soll vor dem Titel März... stehen.
Zuletzt bearbeitet von bender007 am Do 20.11.2008 23:18, insgesamt 1-mal bearbeitet
|
|
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Do 20.11.2008 23:16
Titel
|
|
|
Code: |
div.gn_static_1 ul li a {
padding-left: 10px;
background: transparent url(deinbild.jpg) center left no-repeat;
}
|
Zuletzt bearbeitet von Kash am Do 20.11.2008 23:18, insgesamt 2-mal bearbeitet
|
|
|
|
|
|
|
|
Ähnliche Themen |
javascript stylen - wie, wo?
Dropdown stylen
checkboxen stylen per print.css
[jquery] checkboxes und radiobuttons stylen
Drop-Down bzw Select Box stylen - per Javascript
CSS im style Attribut untergeordnete Tags stylen
|
|