Last Block in and Area
Permalink
I need to add a spacer after each block in my sidebar, which I'm styling with CSS to make a cool divider between each element...however, I do NOT want this spacer after the last block in the area.
Any idea how I can do this?
Thanks!
Any idea how I can do this?
Thanks!
Except that last-child isn't supported in any version of Internet Explorer...which makes it pretty much worthless ;-)
then its more manual- click on a block and design, and then apply your custom css to it. Save it as a preset, then use that preset for all but the first- pain in the ass, but it works.
That kinda sucks. Oh well. Thanks!
You could just manually grab the array of blocks in the area and do a sizeof, then traverse it with a pointer and exclude or include styles based on the current block matching the last.
I wouldn't recommend this approach -- it is very complicated and "brittle" -- there are lots of things that the system does when you call $a->display($c) on an area -- like area layout, area styles, custom block styles, etc. -- that if you just looped through the blocks yourself and outputted them you would not be doing (and in most cases it's not even possible to do -- I've tried!)
I think you have two options here:
1) Use jQuery to style the last item in the area (using the :last-child selector, which WILL work via jQuery in every browser). This is probably your best bet -- only a teeny tiny percentage of users won't have javascript enabled, and if they don't it's not like the site won't work -- they'll just see a slightly different style (which is the least of their worries if they are used to browsing the web without javascript enabled!)
2) Use the other solution suggested by @C5LABS where you manually style the blocks -- but instead of styling every one except the last one, why don't you just make a style that applies to all of them in your css and then only manually style the last block to override those defaults -- this way you only have to do this for 1 block in the area instead of 5 or 10 or whatever.
Hope that helps!
1) Use jQuery to style the last item in the area (using the :last-child selector, which WILL work via jQuery in every browser). This is probably your best bet -- only a teeny tiny percentage of users won't have javascript enabled, and if they don't it's not like the site won't work -- they'll just see a slightly different style (which is the least of their worries if they are used to browsing the web without javascript enabled!)
2) Use the other solution suggested by @C5LABS where you manually style the blocks -- but instead of styling every one except the last one, why don't you just make a style that applies to all of them in your css and then only manually style the last block to override those defaults -- this way you only have to do this for 1 block in the area instead of 5 or 10 or whatever.
Hope that helps!
Thanks guys.
My client isn't very tech savvy...and I have the feeling that showing him how to add the custom style to that last block would still be too much!
What I'm gonna do is just add an extra area at the bottom of the column and instruct my client to always put the last item for the column into that area. Not the ideal approach, but it's as easy as I can make it for them to update themselves.
My client isn't very tech savvy...and I have the feeling that showing him how to add the custom style to that last block would still be too much!
What I'm gonna do is just add an extra area at the bottom of the column and instruct my client to always put the last item for the column into that area. Not the ideal approach, but it's as easy as I can make it for them to update themselves.