CSS-Addon: Anpassung des Blogtitel-Bereiches
Hallo allerseits,
der Blogtitel wird bei Überlänge automatisch umgebrochen. Hierbei habe ich feststellen müssen, dass der Link zum editieren des jeweiligen Blogeintrages mit dem Titel kollidiert. Das würde ich gern umgehend geändert haben. Zum Verständnis hier zwei Screenshots.
Istzustand:
Sollzustand:
Folgende IDs habe ich dafür in Firebug testweise mit Erfolg geändert:
2
3
4
5
6
7
8
.blog-article-title {
margin-right: 0px; <-- alter Wert 65px
}
a.blog-edit-link {
position: absolute;
right: 10px;
top: none; <-- alter Wert 10px
}
Setze ich diese Änderung praktisch um, dann greift der Wert "top: none" bei "a.blog-edit-link" nicht. Warum ist das so?
LG Bommel
(Der wohl wichtigste Grund meiner Beiträge hier.)
Boardnummer: 585867 | Template: Business (unverändert) | Tarif: Basis
Betriebssystem: Windows 7 | Auflösung: 1440x900, 1024x600 (Netbook)
Browser: Mozilla FireFox (17.0.1), Internet Explorer (9.0.11), Google Chrome (23.0.1271.95 m), Safari (5.1.7), Opera (12.10.1652)
Das Problem scheint nun behoben. Der Wert "top: auto" lässt den Link an der richtigen Stelle erscheinen.
Hierzu habe ich auch eine Verständnisfrage. In Firebug vorgenommene Änderungen werden tadellos umgesetzt. Übertrage ich dann diese Werte, um sie fest zu etablieren, tauchen eben solche Fehler auf. Auch der Wert "auto" wurde zuvor einige Male ohne korrektes Ergebnis ausprobiert. Woran liegt das, dass manche Änderungen nicht greifen bzw. nur unzuverlässig funktionieren, wenn ich sie per CSS-Addon ins Template integriere?
LG Bommel
(Der wohl wichtigste Grund meiner Beiträge hier.)
Boardnummer: 585867 | Template: Business (unverändert) | Tarif: Basis
Betriebssystem: Windows 7 | Auflösung: 1440x900, 1024x600 (Netbook)
Browser: Mozilla FireFox (17.0.1), Internet Explorer (9.0.11), Google Chrome (23.0.1271.95 m), Safari (5.1.7), Opera (12.10.1652)
#3 RE: CSS-Addon: Anpassung des Blogtitel-Bereiches
So... mein Forumblog ist nun so angepasst wie ich ihn haben möchte. Bis auf zwei Kleinigkeiten - ich bekomme auf der Übersichtsseite die Spalte zwischen dem Titel (.blog-article-header) und dem Text (.blog-article-text) nicht weg. Im Fenster zum kompletten Artikel ist diese Spalte nicht vorhanden.
Auf der Seite des kompletten Artikels taucht aber noch ein weiteres Problem auf. Es scheint so, dass der Titel eine Ebene über dem Artikeltext liegt. Dadurch verschwindet der Schatten des Titels unten nicht unter dem Artikeltext. Rechts in der Sidebar ist es korrekt.
Weiß hier jemand bitte zu helfen?
LG Bommel
Nachtrag:
Sorry... jetzt habe ich doch glatt das CSS-Script vergessen:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
.blog-article-title {
margin-right: 0px;
}
a.blog-edit-link {
top: auto;
}
.blog-article-header {
background: -moz-linear-gradient(19% 75% 90deg, #DCDCDC, #bbbbbb) repeat scroll 0 0 #E1E1E1;
border-bottom: 0px solid #999999;
border-top: 0px solid #999999;
border-radius: 5px 5px 0 0;
margin-top: 20px;
margin-left: 15px;
margin-right: 10px;
box-shadow: -2px 4px 6px #c6c6c6;
-moz-box-shadow: -2px 4px 6px #c6c6c6;
-o-box-shadow: -2px 4px 6px #c6c6c6;
-webkit-box-shadow: -2px 4px 6px #c6c6c6;
-khtml-box-shadow: -2px 4px 6px #c6c6c6;
}
#blog-sidebar ul {
background: none repeat scroll 0 0 #ffffff;
margin-bottom: 15px;
box-shadow: -2px 4px 6px #c6c6c6;
-moz-box-shadow: -2px 4px 6px #c6c6c6;
-o-box-shadow: -2px 4px 6px #c6c6c6;
-webkit-box-shadow: -2px 4px 6px #c6c6c6;
-khtml-box-shadow: -2px 4px 6px #c6c6c6;
}
#blog-sidebar li {
padding: 6px;
}
#blog-sidebar strong.caption {
border-radius: 5px 5px 0 0;
background: -moz-linear-gradient(15% 90% 90deg, #4E718B, #658BA8, #658BA8 100%) repeat scroll 0 0 #658BA8;
border-top: 0px solid #D4D4D4;
color: #ffffff;
box-shadow: -2px 4px 6px #c6c6c6;
-moz-box-shadow: -2px 4px 6px #c6c6c6;
-o-box-shadow: -2px 4px 6px #c6c6c6;
-webkit-box-shadow: -2px 4px 6px #c6c6c6;
-khtml-box-shadow: -2px 4px 6px #c6c6c6;
}
.blog-article-text {
margin-bottom: 0px;
background: #ffffff;
margin-left: 15px;
margin-top: 0px;
margin-right: 10px;
box-shadow: -2px 4px 6px #c6c6c6;
-moz-box-shadow: -2px 4px 6px #c6c6c6;
-o-box-shadow: -2px 4px 6px #c6c6c6;
-webkit-box-shadow: -2px 4px 6px #c6c6c6;
-khtml-box-shadow: -2px 4px 6px #c6c6c6;
}
.blog-article-body, .ublog {
background: #ffffff;
margin-left: 15px;
margin-bottom: 10px;
margin-right: 10px;
box-shadow: -2px 4px 6px #c6c6c6;
-moz-box-shadow: -2px 4px 6px #c6c6c6;
-o-box-shadow: -2px 4px 6px #c6c6c6;
-webkit-box-shadow: -2px 4px 6px #c6c6c6;
-khtml-box-shadow: -2px 4px 6px #c6c6c6;
}
#blog-article-wrap {
border-right: 0px solid #3C566A;
border-bottom: 0px solid #3C566A;
}
div.blog-catlist-wrap {
background: none repeat scroll 0 0 #eeeeee;
margin: 3px;
border: 1px solid #658ba8;
border-radius: 5px 5px 0 0;
}
.blog-catlist-caption {
background: -moz-linear-gradient(15% 90% 90deg, #4E718B, #658BA8, #658BA8 100%) repeat scroll 0 0 #658BA8;
border-top: 0px solid #D4D4D4;
display: block;
padding: 6px 10px;
border-radius: 5px 5px 0 0;
color: #ffffff;
}
div.blog-catlist-wrap {
background: none repeat scroll 0 0 #eeeeee;
margin: 3px;
border: 1px solid #658ba8;
border-radius: 5px 5px 0 0;
}
.blog-catlist-caption {
background: -moz-linear-gradient(15% 90% 90deg, #4E718B, #658BA8, #658BA8 100%) repeat scroll 0 0 #658BA8;
border-top: 0px solid #D4D4D4;
display: block;
padding: 6px 10px;
border-radius: 5px 5px 0 0;
color: #ffffff;
}
strong.lcaption {
background: -moz-linear-gradient(15% 90% 90deg, #4E718B, #658BA8, #658BA8 100%) repeat scroll 0 0 #658BA8;
border-top: 0px solid #D4D4D4;
display: block;
padding: 6px 10px;
position: relative;
border-radius: 5px 5px 0 0;
color: #ffffff;
box-shadow: -2px 4px 6px #c6c6c6;
-moz-box-shadow: -2px 4px 6px #c6c6c6;
-o-box-shadow: -2px 4px 6px #c6c6c6;
-webkit-box-shadow: -2px 4px 6px #c6c6c6;
-khtml-box-shadow: -2px 4px 6px #c6c6c6;
}
div.lcaption-body {
background: none repeat scroll 0 0 #ffffff;
margin-bottom: 20px;
box-shadow: -2px 4px 6px #c6c6c6;
-moz-box-shadow: -2px 4px 6px #c6c6c6;
-o-box-shadow: -2px 4px 6px #c6c6c6;
-webkit-box-shadow: -2px 4px 6px #c6c6c6;
-khtml-box-shadow: -2px 4px 6px #c6c6c6;
}
strong.lcaption a {
color: #FFFFFF;
}
#blog-sidebar {
margin-top: 10px;
}
(Der wohl wichtigste Grund meiner Beiträge hier.)
Boardnummer: 585867 | Template: Business (unverändert) | Tarif: Basis
Betriebssystem: Windows 7 | Auflösung: 1440x900, 1024x600 (Netbook)
Browser: Mozilla FireFox (17.0.1), Internet Explorer (9.0.11), Google Chrome (23.0.1271.95 m), Safari (5.1.7), Opera (12.10.1652)
Okay... das Problem ist Dank freundlicher Hilfe gelöst. Und damit auch das Verwirrspiel mit der "position"-Angabe "relativ" und "absolut" in diesem Template. Vielen Dank für die Hilfe!
LG Bommel
(Der wohl wichtigste Grund meiner Beiträge hier.)
Boardnummer: 585867 | Template: Business (unverändert) | Tarif: Basis
Betriebssystem: Windows 7 | Auflösung: 1440x900, 1024x600 (Netbook)
Browser: Mozilla FireFox (17.0.1), Internet Explorer (9.0.11), Google Chrome (23.0.1271.95 m), Safari (5.1.7), Opera (12.10.1652)
Ähnliche Themen
Jetzt anmelden!
Jetzt registrieren!