如何在调整窗口大小时保持Rally单选按钮字段保持相同的大小

Question

在我目前的应用程序中，我有一个位于窗口左上角的无线电场。我给了这个组件一个“radio-buttons”的类名，并为组件提供了以下css：

.radio-buttons {
    margin-left: 70px;
    margin-top: 30px;
    border: dotted;
}

边框是点缀的，所以我可以看到组件的轮廓。每次调整窗口大小时，单选按钮字段会缩小到足够小，以至于根本看不到按钮。仍然可以看到虚线边框，所以我知道组件仍在应用程序中，它只是缩小了。我尝试添加：

position: fixed;

到单选按钮类，但这没有帮助。任何帮助将不胜感激！ [希望这是一个简单的解决方案]

Answer 1

所以，我在StackOverFlow之外搜索了我的问题，发现了以下链接：

http://css.dzone.com/news/how-resize-extjs-panel-grid

这个网站回答了“如何调整面板大小”的问题，而不是让面板不会调整大小，但是我偷了下面的代码行并把它放在我的'radio-buttons'类中：

position: absolute;

现在我的单选按钮字段在窗口大小调整时不会自行调整大小！ 基本上我所要做的就是改变

position: fixed;

到

position: absolute;

这是我的最终css类，它保持了单选按钮的位置：

.radio-buttons {
    position: absolute;
    margin-left: 70px;
    margin-top: 30px;
}

Answer 2

在CSS中，您可以指定类或ID的最小宽度和高度。尝试类似以下内容：

.radio-buttons {
  margin-left: 70px;
  margin-top: 30px;
  border: dotted;
  width: 20%;
  height: 20%;
  min-width: 50px;
  min-height: 50px;
}

这会将宽度和高度设置为窗口大小的20％，除非小于50px。