Maybe try...
button p {
padding:0;
margin: 5px 0 5px 0;
display: inline-block;
}
Best,
Karl
Sent from losPhone
On Jun 24, 2013, at 4:38 AM, Manfred Rebentisch <[email protected]> wrote:
> Hello,
> the following HTML-Snippet can be copied and used directly for
> demonstrating the problem (the missing image bl.png is not needed,
> but the img tag must be present):
> the button's without img tag will be positioned some pixels below the
> others. Why? I do not understand that.
>
> Thank you for any help!
>
>
> <html>
> <head>
> <meta http-equiv="Content-Type" content="text/html;
> charset=utf-8" /> <meta charset="UTF-8" />
> <title>Button-Test</title>
> <meta http-equiv="Content-Style-Type" content="text/css" />
> <meta http-equiv="Content-Script-Type" content="text/javascript" />
> <style type="text/css">
> /*top,right,bottom,left*/
> button img {
> margin: 0;
> padding: 0;
> display: block;
> width: 100%;
> height: 100%
> }
> button {
> position: relative;
> width: 60px;
> height: 40px;
> margin: 0 2px 2px 0;
> padding: 0;
> border: 1px solid blue;
> line-height: 1em;
> font-size: 11px;
> text-indent: 0px;
> text-decoration:none;
> overflow: visible;
> }
> button p {
> margin: 5px 0 5px 0;
> display: inline-block;
> }
> div.BCF {
> background: #DDD;
> position: relative;
> width: 375px;
> height: 235px;
> border: 1px solid black;
> margin: 0 4px 4px 0;
> padding: 0;
> }
> div.multmenu {
> background: #ADA;
> width: 330px;
> height: 220px;
> padding: 2px;
> top: 6px;
> left: 18px;
> position: absolute;
> }
>
> </style>
> </head>
> <body>
> <div class="BCF">
> <div class="multmenu">
> <button type="button" ><img src="img/bl.png" /></button>
> <button type="button" ><img src="img/bl.png" /></button>
> <button type="button" >Haupt menu</button>
> <button type="button" ><img src="img/bl.png" /></button>
> <button type="button" ><img src="img/bl.png" height="40"
> width="40"/></button> <button type="button" ><img
> src="img/bl.png" /></button> <button type="button" ><p>Nach-
> richten</p></button> <button type="button" ><img
> src="img/bl.png" /></button> <button type="button" ><img
> src="img/bl.png" height="40" width="40" /></button> </div>
> </div>
>
> </body>
> </html>
>
>
> --
> COMPARAT Software-Entwicklungs-GmbH
> Prießstraße 16
> 23558 Lübeck
> Telefon: 0451/479 56 60
>
> Geschf: Manfred Rebentisch
> AG Lübeck, HRB 3559
>
> Web: http://www.comparat.de
> Die Cards: https://cards.athesios.de
> Businessplattform: https://www.athesios.de
> Lübeck: http://www.luebeck-info.com
> Twitter: http://twitter.com/COMPARAT
>
> ______________________________________________________________________
> css-discuss [[email protected]]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
