0

カスタムCSS3ボタンジェネレーター（http://www.cssportal.com/css3-button-generator/）を使用して、WebサイトボタンにCSS3を埋め込もうとしています。ただし、それはいくつかの厄介な問題を引き起こします。div全体が下に押し下げられます！それを含むdivのCSSは次のとおりです。

.login {
    position: absolute;
    right: 10px;
    top: 10px;
    color: #DDD;
    font-size: 14px;
}

そしてボタンのCSS：

.button {
font-family: Arial;
  color: #ffffff;
  font-size: inherit;
  padding: 7px;
  text-decoration: none;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-box-shadow: 0px 1px 3px #666666;
  -moz-box-shadow: 0px 1px 3px #666666;
  text-shadow: 1px 1px 3px #666666;
  border: solid #003366 2px;
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#42aaff), to(#001a33));
  background: -moz-linear-gradient(top, #42aaff, #001a33);
}

ウェブサイト自体のhtmlを確認したい場合は、http： //www.nosfistis.com/の#navbarです。

4

1 に答える 1

1

CSSルールのパディング：7pxが原因でプッシュダウンされています。現在、これらすべての要素は絶対位置を使用して10px押し下げられています。その1つのボタンを負のマージンで引き上げるか（通常は悪い考え）、他のすべてのボタンを押し下げる必要があります。通常、このような状況では、要素を同じ高さに保つようにしてください（つまり、小さい要素にパディングを追加します）。

于 2012-12-11T03:11:04.470 に答える