Go Premium for a chance to win a PS4. Enter to Win


HTML/CSS - small misalignment in chrome

Posted on 2012-07-19
Medium Priority
Last Modified: 2012-07-19
Hi all,

On my homepage there should be a margin between the navigation bar and the 'client access' table.

In Chrome, the margin does not show. It works fine in IE. Screenshot: Screenshot
Can anyone identify the issue causing this in chrome?

Website link: http://bit.ly/Ode2a9

Thank you
Question by:mhdi
  • 2
  • 2
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 38205078
add margin top:

.twoColLiqLtHdr #mainContent {
margin: 15px 15px 0 4px;

twoColLiqLtHdr.css, line 289
LVL 84

Expert Comment

by:Dave Baldwin
ID: 38205082
Works fine in Firefox and Chrome here.

Author Comment

ID: 38205089
@kozaiwaniec - Adding the margin pushes it down in IE making Chrome ok but IE too low.

@DaveBaldwin - Not sure why you cant see the issue, I can replicate the problem on multiple computers.
LVL 25

Accepted Solution

Kyle Hamilton earned 2000 total points
ID: 38205113
.twoColLiqLtHdr #mainContent {
margin: 0 15px 0 4px;
padding-top: 15px;

In your index.html file, you have a conditional for IE, which specifies padding-top:15px, and that's why IE gets the padding.

You can take it out of the conditional, and apply globally in your main style file.

Play around with it. You could take the padding out completely, and apply margin instead.. dime a dozen..

Author Comment

ID: 38205148
Perfect. Thank you.

Featured Post

Ask an Anonymous Question!

Don't feel intimidated by what you don't know. Ask your question anonymously. It's easy! Learn more and upgrade.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Suggested Courses

876 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question