CSS margin issue

Question

Sorry about the simple question..

do anyone know why my images on the button section of this page are not aligning correctly. the image on the far right seems to be pushed down. Doesn't anyone know what's causing this problem?

Link to Issue

Chords · Accepted Answer · 2012-05-04 21:21:13Z

5

You have a bunch of &nbsp's that aren't in tags. Looks like that seem to be the issue after removing them via Firebug. Remove them and it should line up.

answered May 4, 2012 at 21:21

Chords

6,8702 gold badges41 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

NewBoy Over a year ago

Think that's caused by the CMS - expression engine. These are fields created by expression engine

Chords Over a year ago

I'm not too familiar with expression engine, but if that's what it's doing you should work through the code and figure out how to make it stop.

Eric Fortis · Accepted Answer · 2012-05-04 21:21:50Z

1

There is a lot of white space after deleting it: enter image description here

answered May 4, 2012 at 21:21

Eric Fortis

17.5k6 gold badges43 silver badges63 bronze badges

2 Comments

Tamara Wijsman Over a year ago

I think you need another edit (as your last one made the sentence read weird), I don't think deletion introduces white space and you might want to explain what it is that you are deleting. :)

NewBoy Over a year ago

@Tom Wijsman i actually don't know what i'm deleting, what ppl are mentioning on here isn't showing on my html??

Kyle Nunery · Accepted Answer · 2012-05-04 21:23:03Z

When I inspect the page I see extra html elements inserted into the document

</li><!-- ITEM ENDS HERE --> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<li class="item2">

The extra "nbsp"s are throwing off the alignment.

Tamara Wijsman · Accepted Answer · 2012-05-04 23:11:42Z

You need to remove any spaces or new line between </li> and <li>, so in the HTML mode of your CMS it should literally read </li><li> and not something like:

</li> <li>

If that's somehow not possible, contact the developers / forum of your CMS and ask there for help.

rainecc · Accepted Answer · 2012-05-04 21:25:17Z

This is not valid html. You need to fix that first. Run your page through a validator and correct the "Element div not allowed as child of element ul in this context" errors.

maxxon15 · Accepted Answer · 2012-05-04 21:29:34Z

Lots of whitespaces above each <li>. Remove them and it should work fine. Use Chrome Developer Tools or Firebug to check 'em out.

Collectives™ on Stack Overflow

CSS margin issue

6 Answers 6

2 Comments

2 Comments

Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

2 Comments

2 Comments

Comments

Comments

Comments

Comments

Related