• 0

How to get this to align?!?!


Question

I am trying to get the text after the bullets to align the right way. I have tried all align codes I know but nothing works. I can't really explain but here is a picture to help.

post-111965-1280499632429.jpg

I want "account" to be aligned under "When" and "if" to be aligned with "the". Thanks for all your help!

Link to comment
Share on other sites

15 answers to this question

Recommended Posts

  • 0

Wrap the list with the <ul> tag.

<ul>

<li>one</li>

<li>two</li>

</ul>

I tried that but it just gets rid of the bullets.

post-111965-12805003353295.jpg

**In the picture I know the code isnt closed out, I noticed that when I took it and closed it with the same result, disappearing bullets. (</ul>)

Link to comment
Share on other sites

  • 0

Are you using any sort of reset stylesheet? Those will generally get rid of styling on lists. You'll have to program it back in yourself.

Edit: Yep, you are. I see it in your linked resources up at the top of the first screenshot. :p

Link to comment
Share on other sites

  • 0

Look somewhere in your code for "list-style-type: none;" perhaps?

ALL LI elements should be withing a UL or OL tag.

Link to comment
Share on other sites

  • 0

Holy ****!!! Im not a coder lol, I can just work my way around DW and HTML templates. I am sure I can understand what you all are saying but talk to me as if I am an idiot because when it comes to this, I am. Lol. Thank you for your patience though, I really appreciate it.

@the better twin: When I get rid of the <p></p> it turns the text black and doesnt fix the problem at all.

@njlouch: if and when I find that what should I do?

@Elliot: Huh? Lol

Link to comment
Share on other sites

  • 0

Calm down, Mr. non-coder. Just add this anywhere in your document (but preferably in the head section).

&lt;style&gt;ul {list-style-position: outside !important;}&lt;/style&gt;

You do need the UL tags for it, though. I am assuming you added them like other people have suggested.

Link to comment
Share on other sites

  • 0

Here is the reset.css

post-111965-12805018627285.jpg

Calm down, Mr. non-coder. Just add this anywhere in your document (but preferably in the head section).

&lt;style&gt;ul {list-style-position: outside !important;}&lt;/style&gt;

You do need the UL tags for it, though. I am assuming you added them like other people have suggested.

Thanks, I will try that right now.

Edit: While adding that I noticed <link rel="stylesheet" href="css/reset.css" /> in the source code, should I delete it?

Link to comment
Share on other sites

  • 0

right you have 3 style sheets attached to your site, 960.css, reset.css and style.css. somewhere in one of these files (most probably reset.css) the formatting for lists has been changed.

it should be something like this:

ul {

list-style-type:none;

}

or

li {

list-style:none;

}

or something along those lines

If you want all of your bullet points to be aligned the same across your site the best thing to do is delete it imo.

Link to comment
Share on other sites

  • 0

right you have 3 style sheets attached to your site, 960.css, reset.css and style.css. somewhere in one of these files (most probably reset.css) the formatting for lists has been changed.

it should be something like this:

ul {

list-style-type:none;

}

or

li {

list-style:none;

}

or something along those lines

If you want all of your bullet points to be aligned the same across your site the best thing to do is delete it imo.

Works!! Thanks!!!

Thanks to everyone that helped, I appreciate it.

Link to comment
Share on other sites

  • 0

Works!! Thanks!!!

Thanks to everyone that helped, I appreciate it.

good to hear. the problem with some style resets can be that they give you too much of a clean slate requiring you to code everything back in again.

i tend to just stick with a simple reset such as this:

* { margin:0; padding:0; }

input, form, fieldset{ margin:0; padding:0; }

*,* focus{border:0;outline:none;padding:0;}

Link to comment
Share on other sites

  • 0

good to hear. the problem with some style resets can be that they give you too much of a clean slate requiring you to code everything back in again.

i tend to just stick with a simple reset such as this:

* { margin:0; padding:0; }

input, form, fieldset{ margin:0; padding:0; }

*,* focus{border:0;outline:none;padding:0;}

And thats all you have?

Link to comment
Share on other sites

  • 0

And thats all you have?

yeah the * applies it to all elements tho. some say using the * method is a bit heavy on the rendering engine but some people also swear by it.

Link to comment
Share on other sites

  • 0

When you reset list items, it resets original margin and padding it would have had initially.

 ul {
     margin: 0 0 0 15px;
     }
 ul li {
    margin: 0 0 0 5px;
    padding: 0 0 0 5px;
    }
 ul li ul {
    margin: 0 0 0 15px;
    }

The four numbers style all sides and in order they are: top (0), right (0), bottom (0), left (15 and 5 respectively). It's easier than having "margin-top:, margin-right:, margin-bottom, margin-left." So change the above code to match the needs you have for positioning.

That's what should be recommend to you, code wise, rather than removing your reset.css. Since you've been coding to compensate for the reset, removing a lot (or the file in general) will cause your site to shift over since it will have the reset values.. well, back to being not reset.

Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.