Jump to content
lutz

How To Position The Universal Sidebar?

Recommended Posts

lutz    1
lutz

Hi everybody!

 

I'm trying to place the horizontal sidebar, wich I arranged on top of the branding header, more to the right. I use this for ad tags and these have to be placed on the right side of the page to combine with the skyscraper ad in the vertical (secondary) sidebar besides it.

 

With your help I managed to pull the secondary sidebar up to the top with this code:

 

#site #sidebar2{margin-top:-359px;}

Works great!

 

Now I'm looking for the same thing for the universal sidebar, but horizontal, not vertical.

I already tried things like:

#site #sidebar_universal{margin-left:600px;}

and so on, but couldn't find the right code to make it work.

 

Can somebody tell me, how to re-position the universal sidebar horizontally?

Maybe with another command?

 

Thanks in advance!

 

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Hi,

 

To find the correct selector, you're going to need to use either FireBug or your browsers built-in web dev tool.

 

 

Unfortunately, we are unable to provide you the custom CSS needed to achieve your layout. If you're not comfortable with custom CSS or code. I recommend you contact one of our Pros for assistance 

 

http://www.pagelines.com/pros/


Be sure to also check out our CSS Customization section in our documentation to give you a good head start on CSS changes you can make.


http://support.pagel...ion/custom-css/


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
lutz    1
lutz

@Danny,

 

thanks for your quick response!

 

I absolutely do feel comfortable with custom CSS and code – if I only would knew which one I need ;))

As I wrote above I use CSS code already, thanks to you!

So I only wanted to know which command I need for re-arranging the universal sidebar horizontally.

Would be great if you could help me with that, too!

Share this post


Link to post
Share on other sites
lutz    1
lutz

Dear Danny,

 

I know that site and have tried all the code that possibly could be useful over the weekend.

I tried margin-left..., padding-left... and so on, but without any effect.

 

So I wanted to know from you:

1. is the #sidebar_universal{xxx} command the right one?

2. and which code should move the sidebar content xx pixels to the right?

 

Could you please help me with that?

Thanks in advance!

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

First thing to note is that all sections have a class, we recommend using the class instead of ID, as ID's over power everything else. The class for the sections, will look something like this:

 

.section-section-name

 

For example,

 

.section-sb_universal { }

 

You may also need to use the PageLines override #site or #page.

 

If you wish to position an element, you're may want to look at position - http://www.w3schools.com/css/css_positioning.asp

  • Like 1

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
lutz    1
lutz

Dear Danny,

 

I'll try this in the afternoon, thanks!

But as you said it would be better to use the classes: I now use this command for the outer sidebar:

#site #sidebar2{margin-top:-359px;}

 

Would this be the correct/better command for that?

#site .section-sb_universal{margin-top:-359px;}

If so, I would change that, too ...

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

There is no need to change this:

 

#site #sidebar2{margin-top:-359px;}

As the Sidebar2 doesn't have a class, so just keep that code as it is.

  • Like 1

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
lutz    1
lutz

Dear Danny,

 

thanks again: that

#site .section-sb_universal {margin-left:190px;}

command works great!

Thanks!!!!!

 

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Can you provide a link to your site please


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Is your issue now resolved ?


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
lutz    1
lutz

Yes, it is, thanks! 

I thought I already marked it as solved, but I will do so again ;))

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Similar Content

    • lutz
      By lutz
      I'm using Pagelines for some years now and had to change to responsive webdesign recently (Site Options - Layout Editor - Layout Handling: "responsive with % width" now instead of the former "static with pixel width").
       
      In "Site Options - Header and Footer" - Branding Section: Social Icon Position" I set the distance from bottom to 35 and the distance from right to 1135 as it always has been.
       
      Now the problem is that the social icons move with the width of the browser (IE, Chrome, Opera, Firefox: all the same) and thus out of the window if the frame is too small. Please try out on http://mobiwatch.de
       
       
      I can't position social icons on the right side of the website because there are two sidebars with ads.
       
      And I can't change back to static pixel width design because of Google: they will ignore websites that do not have responsive web design!
       
      So I really, really hope you can help me fix that!!!
       
      Thanks in advance,
      Lutz
       
    • FionaFell
      By FionaFell
      Hi Team, 
       
      I've created a new website using PageLines DMS, and I have a questions around the Mobile display of this website. 
       
      http://imagecatchers.com.au/
       
      When viewed using a laptop/desktop things are great and visitors can see the pics and the form, side by side. 
       
      When being viewed on a smaller mobile device, like an iPhone things that are in two columns (wedding/pets) get a rank/order and appear in one continuous stream of content. 
       
      My questions is, can I choose the order in which items appear? My client wants the text box that contains the contact form to appear first, rather than the large image galleries and testimonials. 
       
      Desktop - side by side is great - perfect as it is now
      Mobile - prefer the text box inc contact form to appear first, then images/galleries/testimonials
       
      Can this happen? What changes do I need to make to have things arranged in this order for mobile devices?
       
      Thanks for your help with this.
       
      - Fiona
    • ssgro66
      By ssgro66
      I'm creating a navbar by placing a 2-column section into the header. I placed our logo in the left section using mediabox. The right will be the navigation bar. I would like the bottom of the navigation bar to align with the bottom of the logo image. The tops are currently aligned. I'm guessing this requires css coding. I'm just not sure how to go about that in DMS.
      A little guidance to nudge me in the right direction would be appreciated.
      Thank You,
      Steve
    • mzhafzah
      By mzhafzah
      **Note: I'm new to wordpress and my major isn't about computers so excuse me if I'm bit far or didn't know some of the technical terms** 
       
      Website URL: www.tycoonje.com
      Framework Version: 
      WordPress Version: 3.5.2
      Plugins in Use:
      Server/Host:
      Screenshots/ Video link:   http://screencast.com/t/1HUw4ZDGAr1
      Details:  I'm using DMS and trying to modify a blog post page by adding a 2 Column Layout to the template section. The problem is that whenever I try to add the Post Loop component to one of the columns, the other one reallocates itself below the first column. Moreover, the reallocated column (whether empty or has another plugin added to it) doesn't allow me to modify its size nor I can move it at all.  I've included a video link explaining everything.
    • kellid
      By kellid
      Hello,
       
      I'm trying to find the best way to place a feature slider next to a universal sidebar. I've made the slider 70% width and the sidebar would fit but I don't know how to put it next to each other. 
       
      Aniy help would be appreciated!
       
      richmondgyn.com
       
      Best,
      Kelli
×