Text hüpft beim Hoovern

Boersenfeger

Ich bitte mal wieder um eure Unterstützung... seit einer Änderung im CSS-Code vor einiger Zeit habe ich diese unangenehme Begleiterscheinung...
[attachment=1]2013-11-15_155026.jpg[/attachment]
[attachment=0]2013-11-15_155048.jpg[/attachment]

Wenn man über die runden Buttons hoovert springt der jeweilige Button und der nachfolgende Text ca 1 cm nach links.
Man beachte auch, das das Wort für die Zeile wechselt...
Zum besseren Aussehen würde auch die Abrundung des obersten Buttons beitragen...
Dieses Phänomen tritt in allen Füchsen auf... der Code ist also überall gleich an dieser Stelle
Für eure Vorschläge sach ich schon mal DANKESCHÖÖÖN!

2002Andreas

Zitat von Boersenfeger

auch die Abrundung des obersten Buttons beitragen...

CSS

@-moz-document url-prefix("chrome://browser/content/aboutDialog.xul"){




#updateButton{
                -moz-appearance:none!important;
                background: gainsboro url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAADUUlEQVQ4jXWTb0xVdQCGfyIykS7IACky0ZVDqQRF7zlNxMs5Z/6lGGzR8E+CwO+sdLBrMjG8kGnAqORfXATmhQLxWoCJmU5xEKJsEF4KSdFkhqaSrWUfXOXq6Utfono/P8/eL+8rxKTE2GSw1ZB2xTBPKrq8pejmXUU3z6mazFdtaXMn8/+I1ZB2dX0O2k4XSdXnedHlIck9ytqqHmJ3NKAk5mLVZOF/yqomDyzbsJ+4D/pJbB8n1tHKAfcXOC+Mk9x2E63lBkuqviRqy3tYDemc3JwbnZTP8zXDxDV/S1zDN6TtPwIAf/xOevt1YptuEF03wtwyDxEb30XRZakQQojFK9JDlq7eTljBWSKqh7EeuoLtyE02tFxm5M4Duq5OsPbwKErDNSKdwzz5/iCPFfYQlZCLGpe5UFgNaZ+XWkpAyQBzyjxE1lxmWXkfWu0lYst6USv6sLqusKh2hHkVQwSV9ONd2MsTrx5E1bIqharLU4GyCZ+9FwkqGWB22RALHCepP3aBa99NcGn0NopzkDnlXzGrdIDpb/fhtbsb/yw3im4OCdWQ38/Ydhyv3d347L1IYPEAfvv6SCxoAeDhr7+xqLwfS9Hfcn4P3vazWDI/QTXMCaEa5oQls5VpOafx2tXF1IJepuR1sTrvI/jzEfd/+pnw4vNMcfTildeNt/0M0187QcDmFhRd3heKbnaFvuxkhjyOz/bP8X6jE5F9GmOni0cPf2H89l3CHJ0Ieyc+2afwNTuwbGklJLkORTdHhKJLxzPr3sJ/01H8trbha3Ygth5Dy6njwY/3GL0+xlM7TjBVduCX0Y5l81ECU5oIX1OCostDYrGWER5jbCPkpTpmpjTjv9GNV8phVr5ezZ3xMYa+HiFcfoxvqpuAV5oJTG4keH0tUbqdpVqGVQghhKJl7XvWyCVkXT1BiQ1MW3OQeFnOrbGreDwent70IZYEF8EJ9cxaVcMCLR/VkFWT1+h8Ts8jNL6CUKMIe3EjbZ+dw/3pGVJ3NRKiVfL4ynIi49/EakhnjCED/vUHxZDFMXo2C217mB9fRNjyImYvL2a+7R0iVuxhSXwOqpZVGW1Lm/m/j1T09EjFkGWqLgcVXd5TDfmDapjDimHWWXXzhcn8X5Ud4xynpfEiAAAAAElFTkSuQmCC") no-repeat !important;


                color:black!important;            
                font-size:13px!important;
                text-decoration:none!important;
                padding-right:5px!important;
                padding-left:26px!important;
                border-color:cadetblue !important;
                border-style:outset !important;
                border-width:2px !important;
                background-position:5px 3px!important;
                border-radius:14px!important;}




        #updateButton:hover{
                -moz-appearance:none!important;
                background: #B2EDFA url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAADUUlEQVQ4jXWTb0xVdQCGfyIykS7IACky0ZVDqQRF7zlNxMs5Z/6lGGzR8E+CwO+sdLBrMjG8kGnAqORfXATmhQLxWoCJmU5xEKJsEF4KSdFkhqaSrWUfXOXq6Utfono/P8/eL+8rxKTE2GSw1ZB2xTBPKrq8pejmXUU3z6mazFdtaXMn8/+I1ZB2dX0O2k4XSdXnedHlIck9ytqqHmJ3NKAk5mLVZOF/yqomDyzbsJ+4D/pJbB8n1tHKAfcXOC+Mk9x2E63lBkuqviRqy3tYDemc3JwbnZTP8zXDxDV/S1zDN6TtPwIAf/xOevt1YptuEF03wtwyDxEb30XRZakQQojFK9JDlq7eTljBWSKqh7EeuoLtyE02tFxm5M4Duq5OsPbwKErDNSKdwzz5/iCPFfYQlZCLGpe5UFgNaZ+XWkpAyQBzyjxE1lxmWXkfWu0lYst6USv6sLqusKh2hHkVQwSV9ONd2MsTrx5E1bIqharLU4GyCZ+9FwkqGWB22RALHCepP3aBa99NcGn0NopzkDnlXzGrdIDpb/fhtbsb/yw3im4OCdWQ38/Ydhyv3d347L1IYPEAfvv6SCxoAeDhr7+xqLwfS9Hfcn4P3vazWDI/QTXMCaEa5oQls5VpOafx2tXF1IJepuR1sTrvI/jzEfd/+pnw4vNMcfTildeNt/0M0187QcDmFhRd3heKbnaFvuxkhjyOz/bP8X6jE5F9GmOni0cPf2H89l3CHJ0Ieyc+2afwNTuwbGklJLkORTdHhKJLxzPr3sJ/01H8trbha3Ygth5Dy6njwY/3GL0+xlM7TjBVduCX0Y5l81ECU5oIX1OCostDYrGWER5jbCPkpTpmpjTjv9GNV8phVr5ezZ3xMYa+HiFcfoxvqpuAV5oJTG4keH0tUbqdpVqGVQghhKJl7XvWyCVkXT1BiQ1MW3OQeFnOrbGreDwent70IZYEF8EJ9cxaVcMCLR/VkFWT1+h8Ts8jNL6CUKMIe3EjbZ+dw/3pGVJ3NRKiVfL4ynIi49/EakhnjCED/vUHxZDFMXo2C217mB9fRNjyImYvL2a+7R0iVuxhSXwOqpZVGW1Lm/m/j1T09EjFkGWqLgcVXd5TDfmDapjDimHWWXXzhcn8X5Ud4xynpfEiAAAAAElFTkSuQmCC") no-repeat !important;

                background-position:5px 3px!important;}
}

Alles anzeigen

Zitat von Boersenfeger

die runden Buttons hoovert springt der jeweilige Button

dann überprüf bitte mal die jeweiligen Daten/Abstände zwischen Button normal und Button hover.

Edit:

Oder gib mir bitte mal deinen kompl. Code dazu, dann teste ich es hier mal.

Boersenfeger

Volltreffer... es fehlte bei hover jeweils

CSS

margin-left: 2px !important;
             margin-right: 10px !important;

warum auch immer...
Und der andere Button ist jetzt auch rund... :klasse:
[attachment=0]2013-11-15_163517.jpg[/attachment]
Vielen Dank...

2002Andreas

Zitat von Boersenfeger

Vielen Dank...

Wie immer...gern geschehen