Jump to content


Photo
- - - - -

one frame for sidebar 1 + 2


  • Please log in to reply
7 replies to this topic

#1 holimed

holimed

    Member

  • Members
  • 11 posts

Posted 10 May 2012 - 11:31 AM

Hi, I successfully managed to tweak the custom CSS to get an outline and shadow around my widgets in the sidebar wrap. But I want the sidebars 1+2 to be in one container, but they aren??t so my CSS does??t work for them (only individually which looks overloaded). How can I add a div around them and apply the same CSS to it? appreciate any pointers! Thanks, Nikki

#2 WebWerx

WebWerx

    Advocate

  • Members
  • 546 posts
  • LocationCanada
  • Framework Version:2.2
  • Country: Country Flag

Posted 10 May 2012 - 01:34 PM

@holimed: Hmm, well you could try creating 2 new divs (one for the left widget & 1 for the right one). And then replace "outline-color" with "border-top", etc.... (Omitting "border-left" or "border-right"). Not sure if that work.... But you could just take the code from "#sidebar-wrap div.widget-pad" and clone in order to experiment. Am I making sense? Not sure how it will all line up or the dynamics of "box-shadow". Or how things would line up. Or recreate the shadowed border around everything: "two-sidebar-right #pagelines_content #sidebar-wrap " Sch?┬Ânen Tag noch!

#3 holimed

holimed

    Member

  • Members
  • 11 posts

Posted 10 May 2012 - 03:05 PM

Danke, I tried that but the shadow doesn??t work with that option, neither do I seem to get the shadow around everything working..

it might work that way if i could define the widget-pad for the universal sidebar and the sidebar 1+2 separately, but so far no luck with that..

Here my code:

Please Login or Register to see this Hidden Content


Any suggestions? My main problem seems to be identifying the right divs even though I use the safari inspector.. Will give it another try tomorrow and else resort to a borderless background with shadow to the bottom only.

Appreciate any code tips till then!

Thanks!

#4 WebWerx

WebWerx

    Advocate

  • Members
  • 546 posts
  • LocationCanada
  • Framework Version:2.2
  • Country: Country Flag

Posted 10 May 2012 - 03:24 PM

Ya this is hard one as there is nothing defined in the framework to capture both widgets within one div. or at least nothing I can see. I wonder what @simple_mama thinks?

#5 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 11 May 2012 - 12:58 AM

Okay, a little progress, but you won't like it much.

Your custom code has eliminated padding from the sidebars in some places and as a result, adding a border pushes the entire group of sidebars down below content. You'll need to adjust the total width of the canvas to make room for the added space. I think you'll have to remove

Try this:

Please Login or Register to see this Hidden Content



#6 holimed

holimed

    Member

  • Members
  • 11 posts

Posted 11 May 2012 - 05:59 AM

Hiya, Thanks for the ideas, yes @rangelone, I did have outline instead of border for that reason before, but with online I can??t remove one side.. will give you code a try and report back :)

#7 holimed

holimed

    Member

  • Members
  • 11 posts

Posted 11 May 2012 - 06:42 AM

just a thought, could I achieve this by going to a one sidebar layout where i use i.e. universal above and another below, and the one below I split into two columns?

ok, based on this idea I just found a great widget:

Please Login or Register to see this Hidden Content



it??s not exactly what i was initially aiming for, but close and actually gives me a bit more flexibility!

Thanks :) this point is solved for me!

#8 Danny

Danny

    Is Awesome!

  • Moderators
  • 15084 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 11 May 2012 - 12:15 PM

Hi Nikki, I have visited your website and I see you have Universal Sidebar, Sidebar1 and Sidebar 2. I apologise but I am not quite sure what you're trying to accomplish. Would it be possible to reply please and go into greater detail or provide a screenshot.