[Solved] Shifting Links within Lists

[ConfusingPhilosophy]

Hi guys!

I’ve come across a problem that I have been trying to work around, but it keeps popping up!

The issue here is that I will put links within <ul> and <li> tags, assuming it would work normal. However, every time that I click it, it’ll space itself further from the list node or it will replace itself in a different locations and/or with different paddings. Here’s an example of what I have.

Code:

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

• Link One
• Link Two
• Link Three

Nunc venenatis arcu et dolor hendrerit laoreet.

[TheDoc]

It sounds like you have some CSS overriding your list. Without a link to the live page, it’ll be near impossibly to provide much further help!

[ConfusingPhilosophy]

Oh! Right, sorry bout that. Here’s a page with a good example of what I am talking about.

http://www.gwu.edu/~kappasig/brothers.html

The links in the side boxes. They’re assigned to anchors, but every time I click them, they shift. Its been occurring with other links throughout the site, as well.

[TheDoc]

Ah ha! I’ve found the problem. They are shifting because of this:

#menu a, a:active, a:visited {
padding:4px 6px;
}

You have to declare the div for each element, or else the a:active and a:visited will apply to ALL links on the site.

I think what you meant to put was:

#menu a, #menu a:active, #menu a:visited {
padding:4px 6px;
}

That should solve your shifting problem across the site.

[ConfusingPhilosophy]

"TheDoc" wrote:

Ah ha! I’ve found the problem. They are shifting because of this:

#menu a, a:active, a:visited {
padding:4px 6px;
}

You have to declare the div for each element, or else the a:active and a:visited will apply to ALL links on the site.

I think what you meant to put was:

#menu a, #menu a:active, #menu a:visited {
padding:4px 6px;
}

That should solve your shifting problem across the site.

Yes! I tried sorting them out like you said and it works like a charm.

Thanks again!

[Author]

Posts