Alignment problem

[geiger]

I have the following vertical alignment problem in the breadcrumb. Can you please help identify the problem?

http://wearabletechforums.com/forums/

Thanks!

[RyanReese]

Sure. But what’s the “problem”?

[RyanReese]

If the issue is the top of the arrow is poking out in the purple (I can only assume that is the issue…?) you can just change the negative top margin on “.breadBoxTop” to -15px instead of -20px

[geiger]

Thanks!

[ronpat]

There seems to be a pileup of padding that has been compensated for with a negative margin-top.

Negative margins are often bandaids for misapplied styles. I would recommend this approach to get rid of the vertical negative margins in this case.

http://wearabletechforums.com/css.php?css=xenforo,form,public&style=6&dir=LTR&d=1414980588
.breadBoxTop, .breadBoxBottom {
    padding: 5px 0 10px;  /* changed from {padding: 15px 0 10px;} */
}

http://wearabletechforums.com/css.php?css=GWiz_clickableRow,bb_code,facebook,google,login_bar,node_category,node_forum,node_list,profile_post_list_simple,sidebar_share_page,twitter,xb,xb_node_layoutsThree,xb_scroll_buttons,zipped_loginform&style=6&dir=LTR&d=1414980588
.breadBoxTop {
    margin: 0 -20px;  /* changed from {margin: -20px -20px 0} */
}

http://wearabletechforums.com/css.php?css=xenforo,form,public&style=6&dir=LTR&d=1414980588
#content .pageContent {
    padding: 0px 20px 10px;  /* changed from {padding:10px 20px} */
}