icon-notext not aligned correctly vertically in header #4729

Closed
quintenvk opened this Issue Jul 20, 2012 · 3 comments

Comments

Projects
None yet
2 participants
@quintenvk

The icon-notext is positioned vertically by using "top: 6px". However, when the icon is placed within a controlgroup, this top: 6px causes it to be aligned too much towards the bottom and even below the header.

The fix would be to add the following to the css:

.ui-header .ui-controlgroup-controls .ui-btn-icon-notext {
top: 0;
}

Edit: apparently, there was another culprit, namely ui-btn-right, which also adds top: 3px. The fix for this issue would be the following:

.ui-btn-right.ui-controlgroup {top:0;}

@ghost ghost assigned jaspermdegroot Jul 20, 2012

@jaspermdegroot

This comment has been minimized.

Show comment Hide comment
@jaspermdegroot

jaspermdegroot Jul 20, 2012

Member

@quintenvk

Thanks for reporting the issue and the suggested fixes. I am going to look into it.

Member

jaspermdegroot commented Jul 20, 2012

@quintenvk

Thanks for reporting the issue and the suggested fixes. I am going to look into it.

@jaspermdegroot

This comment has been minimized.

Show comment Hide comment
@jaspermdegroot

jaspermdegroot Jul 20, 2012

Member

Note: issue #4713 is also about a controlgroup with a of class ui-btn-right in the header. Although that one is about the margin and this issue is about top offset we have to look at both at once.

Member

jaspermdegroot commented Jul 20, 2012

Note: issue #4713 is also about a controlgroup with a of class ui-btn-right in the header. Although that one is about the margin and this issue is about top offset we have to look at both at once.

@jaspermdegroot

This comment has been minimized.

Show comment Hide comment
@jaspermdegroot

jaspermdegroot Aug 3, 2012

Member

hi @quintenvk

I didn't see the issue with top: 6px;. The top: auto; rule for ui-btn-icon-notext inside controlgroups overrides this.

The top: 3px; for class ui-btn-right only applies to the controlgroup, not to the ui-btn-icon-notext inside it (the top property is not inherited).

Here is an example that uses latest code: http://jsfiddle.net/ZWr6J/show/

I am closing the issue, but let us know if the problem isn't solved.

Member

jaspermdegroot commented Aug 3, 2012

hi @quintenvk

I didn't see the issue with top: 6px;. The top: auto; rule for ui-btn-icon-notext inside controlgroups overrides this.

The top: 3px; for class ui-btn-right only applies to the controlgroup, not to the ui-btn-icon-notext inside it (the top property is not inherited).

Here is an example that uses latest code: http://jsfiddle.net/ZWr6J/show/

I am closing the issue, but let us know if the problem isn't solved.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment