Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Sidebars & Widgets »

[SOLVED] How to move LI Discs closer to sidebar list text


  #1  
Old Nov 16, 2014, 04:07 PM
rhythm
 
32 posts · Jan 2010
Based on a suggestion here on the Atahualpa forum, I added some CSS Insert code to create bullets (discs) next to my right sidebar list items. Here's what I added:

div.widget ul li {
display: list-item !important;
list-style: disc !important;
list-style-position: inside;
color: #2D85BA;
}

If you look at the right sidebar on my site, toawaken.org, you'll see it worked fine. Now I'd like to move each bullet a bit to the right, i.e., closer to the text of each LI, and further away from the black border line separating the sidebar from the center column main body text. Any suggestions?
  #2  
Old Nov 17, 2014, 07:27 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
reduce the left padding in that CSS
HTML Code:
padding-left: 0px;
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Nov 18, 2014, 10:53 AM
rhythm
 
32 posts · Jan 2010
Quote:
Originally Posted by juggledad
reduce the left padding in that CSS
HTML Code:
padding-left: 0px;
Hi Juggle, thanks, but where am I putting this code to reduce the padding to 0px? In the CSS Inserts, right there within the lines of code I posted? Or, if you meant within the Style.CSS Editor, on what line? The Style.CSS Editor has code for alignleft, alignright & aligncenter and wp-caption, but currently there is no padding settings to reduce in there except for padding: 4px; under wp-caption.

So please clarify where I will find this padding-left Xpx; line that I can reduce to 0px, thanks
  #4  
Old Nov 18, 2014, 12:03 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
well you could over ride it in the CSS Inserts option or you could go to ATO->Style WIDGETS->Widget List Items and adjust the 'Left Padding for Links' <- note: doing it here will effect all widgets. If you just want to effect this widget, you will need to add the CSS to the CSS Inserts option and qualify the CSS Selector with the ID for the widget
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Nov 18, 2014, 01:01 PM
rhythm
 
32 posts · Jan 2010
Oops. Changing the Left Padding for Links (or inserting padding-left: 0px; in CSS Insert) moves the list items TEXT left-wards, closer to the bullets; it does not move the bullets right-wards, closer to the text. Don't need to move the text of the list items, where they are sitting under the widget title is just fine. Only want to move the bullets inward, to the right a bit, closer to the text and away from the border line separating the body content form the sidebar.

The bullets (discs) were added by inserting an LI div with the "disc" list-style, and a position of "inside" which places them inside to the right of the body-sidebar border...

div.widget ul li {
display: list-item !important;
list-style: disc !important;
list-style-position: inside;

...but there's nothing padding-wise or margin-wise in this code to tell the discs (not the text) how far away from the border or how close to the text, to sit. That's what I'm looking for.
  #6  
Old Nov 18, 2014, 01:47 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
You may have to do both. move teh text left towards the disc and then move the disc AND test to the right.

This is where using a code editor is important, so YOU can play with the CSS and see what YOU want. You can even see which CSS rules you need to apply it to.

I'd try decreasing the left padding to 0 and then increasing the left margin
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #7  
Old Nov 18, 2014, 05:57 PM
rhythm
 
32 posts · Jan 2010
Thanks Juggle. padding 0 plus added margin did the trick. I already tried that with the margin at 8 and it didn't seem to move the discs much away from the border line. So I thought that wasn't working. When I increased the margin to 16, they moved quite a bit away. Thanks for the suggestion

Bookmarks



Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Looking to get content to be closer to the edges of screen porkchopexpress Montezuma Theme 3 May 4, 2013 08:06 AM
how do i move a section up closer to header or nav bar ididapoopy Header configuration & styling 1 Sep 13, 2010 12:36 PM
[SOLVED] How to move posts and sidebars up closer to header? jms5017 Center area post/pages 5 Aug 5, 2010 12:29 AM
How move LEFT sidebar items to RIGHT sidebar? insist_100 Sidebars & Widgets 1 Mar 23, 2010 08:50 PM
[SOLVED] How can I move vertical links list into horizontal list on navigation bar? kevandali Page & Category Menu Bars 2 Jul 21, 2009 02:04 PM


All times are GMT -6. The time now is 01:35 AM.


Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.