0

border-radius90度「回転」させたい効果があります。

#a{
  height:55px;
  width:70px;
  border-radius:25px 25px 42px 42px / 9px 9px 35px 35px;
}
#b{
  height:70px;
  width:55px;
  border-radius:42px 25px 25px 42px / 9px 35px 35px 9px;      
}

縦に並べられた要素 b で要素 a の形状を使用したいと思います。しかし、このフィドルhttp://jsfiddle.net/mVp29/2/を確認すると、実際には左端が完全にまっすぐになっていることがわかります。何が起こっているのか、どうすれば修正できるのか。transform:rotate(90deg);また、それらは要素のコンテンツであるため、使用したくありません。

これは Firefox と IE の両方で発生しているようで、値をピクセルまたはパーセンテージで宣言しても発生するようです。

4

1 に答える 1