Jump to content


Photo
- - - - -

One easy and one hard css question


Best Answer Rob , 04 March 2013 - 09:50 PM

Hi Reid,

 

I grabbed this directly from your site using Firebug:

 

 
#tag_cloud-2 .widget-title {
    font-size: 21px;
    font-weight: normal;
    text-align: center;
}
.widget .widget-title {
    color: black;
    font-size: 14px;
    margin-bottom: 0.6em;
    padding: 3px 8px 3px 0;
    text-align: center;
}

As you can see, the widget title has a margin-bottom of 0.6em and padding as well.  If you change those, as Danny said, you'll do so globally, however, I think you can prefix a modified copy of the 2nd group with #tag_cloud-2.  From all I see, it's that one component, the title, which has added space between the title and the tags.

Go to the full post


  • Please log in to reply
5 replies to this topic

#1 reidthis

reidthis

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 03 March 2013 - 12:54 AM

Easy ?

 

How do I change the padding for only the tag-cloud-2 widget (I want there to be less space above "Site Resources" on the right sidebar.

 

Please Login or Register to see this Hidden Content

 

Hard ?

 

On the same page, how do I get rid of the "flex-control-nav" (the small circles below the slider)?

 

Also, does anyone else see maybe a one or two pixel white space between the slide and the menus? It is apparent especially with some of the slides. How can I fix that??

 

Thanks a million!!!

 

-Reid



#2 Danny

Danny

    Is Awesome!

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

Posted 03 March 2013 - 08:11 AM

Hi Reid,

 

 

Unfortunately, we are unable to provide you the custom CSS needed to achieve your layout. Therefore, I recommend using Firebug or your browsers built-in web dev tools and inspect the widget to find the correct code.

 

For assistance visit our custom CSS documentation - 

Please Login or Register to see this Hidden Content

 

Regarding the navigation for your slider, you can configure the slider using the options to only use arrow navigation. Simply go to Wordpress Admin Dashboard > Pages > Select the page that you have the slider active on. Then scroll down to the PageLines Meta Settings and select the QuickSlider, then configure the setting for Slider Navigation mode 



#3 reidthis

reidthis

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 03 March 2013 - 11:11 PM

Ninja,

 

Thanks. I have tried those resources, and have tried many combinations trying to achieve my layout.

 

Firebug is actually my tool of choice.

 

If I try the

 

.widget .widget-pad {
    padding0;
}
 

Then it obviously changes it everywhere. However, I only want to change it on the one widget. I have tried many different combinations of

 

.tag_cloud-2 {

    padding0;
}
 
.widget .widget-pad .tag_cloud-2{
    padding0;
}
 
etc. but none of them are working.
 
In addition, for the second question:
 
I have entered in
.two-sidebar-center #column-main .mcolumn-pad {
padding-right: 0px;
padding-top: 0px;
padding-left: 0px;
}
 
but there still seems to be maybe 1 or 2 pxs in between. Can you see this or help me?
 
Thanks!!


#4 Danny

Danny

    Is Awesome!

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

Posted 04 March 2013 - 07:34 AM

Using

 

.widget-pad {}

 

is like you said going to change it for all widgets. This is why you need to inspect your CSS using Firebug or your browsers web dev tools. When you inspect your code, you can see that all widgets are given either a unique ID/class or both.

 

In terms of the cloud widget it has both a unique ID and class, you can then use the ID or class infront of the widget-pad {} code and thus only change the cloud widget.

 

For example (please remember this is an example and will probably not work)

 

 

Please Login or Register to see this Hidden Content

 

You do not need to use CSS to remove the circle navigation, there is a QuickSlider option for it, see my image.

 

Please Login or Register to see this Hidden Content



#5 mstmarie1

mstmarie1

    Advanced Member

  • Members
  • 52 posts
  • Framework Version:PageLines Developer
  • Country: Country Flag

Posted 04 March 2013 - 09:10 PM

#sb_secondary has a top margin, so you can remove that as well to bump up the entire sidebar.

 

If you want to get rid of the .flex-control-nav, just set it to display:none;



#6 Rob

Rob

    One Smart Egg

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

Posted 04 March 2013 - 09:50 PM   Best Answer

Hi Reid,

 

I grabbed this directly from your site using Firebug:

 

Please Login or Register to see this Hidden Content

As you can see, the widget title has a margin-bottom of 0.6em and padding as well.  If you change those, as Danny said, you'll do so globally, however, I think you can prefix a modified copy of the 2nd group with #tag_cloud-2.  From all I see, it's that one component, the title, which has added space between the title and the tags.