page class suffix
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29362
- Thanks: 954
- Volunteer
-
just noticed that I can apply multiple page-class-suffix!
Just divided with a "blank"!
page-class-suffix like : "(blank)style1(blank)style2"
gives in mixxmag: <h1 class="componentheading style1 style2">my headline</h1>
An now I can style this via css:
.style1 { height: 150px; }
.style2 { background: blue; }
I always thought that the blanks would have been deleted by joomla (wasnt that the case in J! 1?) ...
Well thats pretty cool ... :cheesy:
Using the normal suffix without blanks changes so much ...
I have to rethink the styling of page titles ...
... like image replacement-techniques for headlines with neg. text-indent and stuff ...
P.S.: Advanced users surely know this – for me its like a new feature (overrides in a cheap version)
-
-
-
- James Spencer
- Preeminent Rocketeer
- Posts: 46340
- Thanks: 50
-
1.5 doesn't delete blanks
Btw, multiple classes aren't supported well by IE6 so that could be a problem. - James Spencer / Developer & Support / Hull, UK
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29362
- Thanks: 954
- Volunteer
-
Just to clear this up:
www.ryanbrill.com/archives/multiple-classes-in-ie/
And thx to James for that tip ...
multiple-classes can be used ... carefully!
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29362
- Thanks: 954
- Volunteer
-
h1.style1 { background: green; }
h1.style1.style2 { background: blue; height: 150px; }
will not work in IE6, because IE 6 reads the last class, and the h1.style1 will stay blue all the time ...
but
h1.style1 { height: 150px; }
h1.style2 { background: blue; }
will work? (If I understand this right)
-
-
-
- Manuel Garnier
- Jr. Rocketeer
- Posts: 25
- Thanks: 0
-
I'm using multiple class with Crystalline and it rocks with Google Chrome or Firefox, but with IE8 my extra class don't works
I've been looking over the web to check if there was some best practice but it looks like I 'm doing fine.
The screen shots below are showing the bottom menu of the website I'm working on.
in chrome everything looks fine :
This image is hidden for guests.
Please log in or register to see it.
in IE8.... :
This image is hidden for guests.
Please log in or register to see it.
this is the class suffix for the bottom menu :
This image is hidden for guests.
Please log in or register to see it.
.ms-bottom uses some general style for the menu
.wood is used to show the picture behind the menu title
.towel is used to show the towel behind the Menu list
the css :div.ms-bottom.wood .module-content {background:url(../images/module-styles/items/plaque-bois.png)0 -6px no-repeat;} div.ms-bottom.towel .module-bm {background:url(../images/module-styles/items/towel-bottom.png)2px 0px no-repeat;height:135px;margin: 0 0px;} div.ms-bottom.towel .module-inner {background:url(../images/module-styles/items/towel-top.png)50% 10px no-repeat;}
the index.php rendered in the browser :<div class="ms-bottom wood towel">
I'm using multiple class so I can easely prepare different colors for the towels and just change the suffix to towel-pink for exemple for them to show in pink color. Same for the wood suffix,if I want to be able to use a glass or metal suffix...
I know I could use a work arround like using a single suffix like :
ms-bottom-wood-towel
and if I want to change the colors and the matter :
ms-bottom-metal-towel-pink
but it would clearly makes the css style sheet heavier and less readable !
IE8 is supposed to support multiple class, I think I'm doing something wrong, could you light me up please
-
-
-
- manualva
- Newbie
- Posts: 6
- Thanks: 0
-
Hi Henning!
I tried multiple classes in the panacea template placing the " " between each page class suffix and it doesn't work. Does the panacea template prohibit multiple classes or am I doing something wrong? I'm inferring when you refer to (blank) it's the actual spacebar press BTW. Thanks!
-
Time to create page: 0.082 seconds