WordPress + Thesis Tutorial: Finding and fixing phantom spacing on your web page

I came across something while working with WordPress and Thesis that I know will help at least one person and possibly save them hours of frustration. So here is the tutorial.

I was working on a revision to a visual layout of a website I previously helped develop on the Thesis theme framework. I spent more time than I should trying to find out where the extra space between webpage elements was coming from. Was it the CSS? It had to be.

I checked the CSS using my editing tools. No extra margin, no extra padding, yet I still could not get page elements aligned the way I wanted. There was a mysterious “gap” between page elements. No matter what I tried with my CSS (other than negative margins—no bueno in this case) the gap would not go away.

I finally got smart and looked as source code—the html. Typically I get to the source code earlier in the process, but this time I thought all my issues were in CSS but they were not. The key to the solution lie inside the HTML.

I recorded the video tutorial below in hopes that it might help you. If it does, let me know in the comments.

Be sure to click on the small, 4-arrow button in the bottom right corner of the video (as shown in the graphic below) to see the video at full size. Hope this helps.

Do you need help with your website?

If you are a web designer or web developer needing help, or a 'do-it-yourselfer' looking for a professional Internet presence I can help. If you need help with a specific WordPress issue or a complete website, I offer consultation, complete web design, and web development services. Get in touch and we can talk about your needs and start the process.

, , , , , , , , , , , ,

Do you need a WordPress consultant? Someone with experience?

I specialize in making WordPress work for people.

If you need help with a specific WordPress issue, I offer consultation, complete web design, and web development services.

Get in touch and we can talk about your needs and start the process.