List to align left

This is a discussion on "List to align left" within the Web Page Design section. This forum, and the thread "List to align left are both part of the Design Your Website category.



Go Back   Webforumz.com > Main Forums > Design Your Website > Web Page Design

Notices


Reply
 
LinkBack Thread Tools
  #1 (permalink)  
Old Feb 22nd, 2006, 13:55
csa csa is offline
Up'n'Coming Member
Join Date: Nov 2005
Posts: 67
Thanks: 0
Thanked 0 Times in 0 Posts
List to align left

I'm using a list as follows below however I want the bullets to align to the left hand side of the div tag navcontainer, at the moment it indents the list in FF but it's fine in IE. I know FF doesn't like margin... but it's also ignoring any padding I put in.

#navlist{
list-style-image: url(images/bullet.gif);
margin-left: 20px;
}
#navcontainer{
width: 275px;
}

thanks

Last edited by csa; Feb 22nd, 2006 at 14:14.
Reply With Quote

  #2 (permalink)  
Old Feb 22nd, 2006, 15:00
Rob's Avatar
Rob Rob is offline
Head Admin & CEO

SuperMember
Join Date: Jul 2003
Location: at my desk
Age: 34
Posts: 2,952
Blog Entries: 7
Thanks: 7
Thanked 4 Times in 4 Posts
Send a message via MSN to Rob Send a message via Skype™ to Rob
Re: List to align left

Try this:-

Change to margin-left:0; padding-left:20px;

Not 100% sure it'll work.
__________________
Rob - SEO Specialist
Owner & Founder of Webforumz.com

I am currently unavailable for private work
Reply With Quote
  #3 (permalink)  
Old Feb 22nd, 2006, 15:33
herkalees's Avatar
Highly Reputable Member
Join Date: Jul 2005
Location: Massachusetts, USA
Age: 87
Posts: 576
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via AIM to herkalees Send a message via MSN to herkalees Send a message via Yahoo to herkalees
Re: List to align left

I always use a little home-made trick when attempting to get bullets to look the same in browsers:

On the <ul>:
margin-left:0;
padding-left:0;

On the <li>'s:
margin-left:14px;
padding-left:14px;

For some reason, defining both, then messing around with the numbers seems to provide equal results in some browsers.
Reply With Quote
  #4 (permalink)  
Old Feb 23rd, 2006, 12:24
Rob's Avatar
Rob Rob is offline
Head Admin & CEO

SuperMember
Join Date: Jul 2003
Location: at my desk
Age: 34
Posts: 2,952
Blog Entries: 7
Thanks: 7
Thanked 4 Times in 4 Posts
Send a message via MSN to Rob Send a message via Skype™ to Rob
Re: List to align left

I'm not one for styling lists except or use in navigation so generally always remove the bullets..... I'll remember this one Herkalees!
__________________
Rob - SEO Specialist
Owner & Founder of Webforumz.com

I am currently unavailable for private work
Reply With Quote
  #5 (permalink)  
Old Feb 23rd, 2006, 13:28
csa csa is offline
Up'n'Coming Member
Join Date: Nov 2005
Posts: 67
Thanks: 0
Thanked 0 Times in 0 Posts
Re: List to align left

Thanks, I can see how this would work. However I often have more than one list on my page and end up get confused as to the best way of identifying each. Obviously ul will apply to all my links, could someone be so kind as to show me a brief example of how I to do this correctly?

Thank you.
Reply With Quote
  #6 (permalink)  
Old Feb 23rd, 2006, 14:12
herkalees's Avatar
Highly Reputable Member
Join Date: Jul 2005
Location: Massachusetts, USA
Age: 87
Posts: 576
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via AIM to herkalees Send a message via MSN to herkalees Send a message via Yahoo to herkalees
Re: List to align left

Give each ul it's own id, then apply different rules using CSS for each:

<ul id="listone">
<li>Thing</li>
<li>Another Thing</li>
</ul>

#listone {
margin-left:0;
padding-left:0;
}
#listone li {
margin-left:14px;
padding-left:14px;
}
Reply With Quote
  #7 (permalink)  
Old Feb 26th, 2006, 07:19
New Member
Join Date: Feb 2006
Age: 30
Posts: 1
Thanks: 0
Thanked 0 Times in 0 Posts
Re: List to align left

does anyone know how to make a css auto content song load on a web site
Reply With Quote
Reply

Tags
list, align, left

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Using a list for navigation, can you center a list? tonyb Web Page Design 4 May 9th, 2008 16:26
2 Drop down list - auto select depending on choice from first list ciaranleeper JavaScript Forum 0 Mar 26th, 2008 10:38
Spacing between list items incorrect when span tag is used in a list item... MikeTheVike Web Page Design 5 Apr 18th, 2007 01:52
Align list to the left csa Web Page Design 4 Aug 16th, 2006 08:22
Having trouble moving list to the left csa Web Page Design 2 Dec 12th, 2005 08:56


All times are GMT. The time now is 19:03.


Powered by vBulletin®
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Friendly URLs by vBSEO 3.2.0 RC8
© 2003-2008 Webforumz.com : All Rights Reserved

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43