Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

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

[SOLVED] How to Format a List at the Right of an Image?


  #1  
Old Aug 29, 2011, 08:26 AM
LaneLester
 
76 posts · May 2010
North Georgia, NA
This is an old problem for which I've not seen a solution that works for me. I'm hoping since I last whined about it, someone has come up with the answer.

When there is an image at the left side of a post, a list (ul or ol) beside it will not be indented the same as when the image is not there. The bullets or numbers, instead of being indented, are far left in the image or the border of the image.

Do you know a solution for this?

Lane

Last edited by LaneLester; Aug 30, 2011 at 05:51 AM.
  #2  
Old Aug 29, 2011, 08:56 PM
lmilesw's Avatar
lmilesw
 
10,174 posts · Jul 2009
Central New York State USA
Try using the list-style-position property in those cases.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #3  
Old Aug 30, 2011, 05:50 AM
LaneLester
 
76 posts · May 2010
North Georgia, NA
Quote:
Originally Posted by lmilesw
Try using the list-style-position property in those cases.
Thanks, Larry! The following CSS Insert did the trick:
Code:
div.page ul {
list-style-position:inside;
}
I'm using "div.page" because the list in question is on a page, rather than a post.

I had not known about the list-style-position property before and had resorted to padding to get the elements where I wanted them. This worked if no image was involved.

Later: I discovered the above would not work if the image were to the right of the list. The bullets were indented even if "outside" is used. The following is what I used to get the bullets lined up with the left margin of the rest of the text:
Code:
div.page ul {
list-style-position:outside;
padding:0 0 0 15px;
}
The result can be seen at http://i.imgur.com/NPStg.png
Lane

Last edited by LaneLester; Aug 30, 2011 at 06:33 AM.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
<li> list with Image how to... mirco65 Page & Category Menu Bars 2 Feb 17, 2011 04:52 PM
Format comments alickerman Comments, trackbacks & pings 7 Oct 1, 2009 05:17 AM
[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
Trouble uploading image in a correct format nrc New Versions, & Updating 1 May 5, 2009 11:43 PM
Flexx theme - How to change my "List Category or Archives" to "List Titles ONLY" ?? idaks01 Post-Kicker, -Byline & -Footer 0 Mar 28, 2009 06:22 PM


All times are GMT -6. The time now is 04:11 PM.


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