javascript - 有没有办法使我全 Angular ？

我想使这种手风琴在任何尺寸下都能全屏显示。
我设法使其全高，但坚持使其全角。
我尝试使用百分比，但是任何更改都只会带来随机结果。
有什么办法可以解决这个问题？

* {
    margin: 0;
	padding: 0;
	box-sizing: content-box;
  }

.accordion {
    font-family: Arial, Helvetica, sans-serif;
    border-width: 0px;
    margin: 0;
    height: 100vh;
    width: 100vw;
}

.accordion > ul > li,
.accordion-title,
.accordion-content,
.accordion-separator {
    float: left;
}

.accordion > ul > li {
    background-color: #b62a2a;
    margin-right: -1200px;
    margin-bottom: -0px;
}

.accordion-select:checked ~ .accordion-separator {
    margin-right: 1200px;
    margin-bottom: 0px;
}

.accordion-title,
.accordion-select  {
	background-color: #ed2945;
	color: #ffffff;
	width: 2.5em;
	height: 100vh;
	font-size: 15px;
}

.accordion-title span {
    margin-bottom: 20px;
    margin-left: 20px;
}

.accordion-select:hover ~ .accordion-title,
.accordion-select:checked ~ .accordion-title {
    background-color: #c22439;
}

.accordion-title span  {
    transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -ms-writing-mode: lr-bt;
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    margin-left: 0px;
    line-height: 40px;
}

.accordion-content {
    background-color: #8E7B7B;
    color: #C22439;
    height: 100vh;
    width: 1104px;
    padding: 48px;
}

.accordion-title,
.accordion-select:checked ~ .accordion-content {
    margin-right: 0px;
    margin-bottom: 0px;
}

.accordion {
    overflow: hidden;
}

.accordion > ul {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 101%;
}

.accordion > ul > li,
.accordion-title {
    position: relative;
}

.accordion-select {
    cursor: pointer;
    position: absolute;
    opacity: 0;
    top: 0;
    left: 0;
    margin: 0;
    z-index: 1;
}

.accordion-title span {
    display: block;
    position: absolute;
    bottom: 0px;
    width: 100%;
    white-space: nowrap;
}

.accordion-content {
    position: relative;
    overflow: auto;
}

.accordion-separator {
    transition: margin 0.3s ease 0.1s;
    -o-transition: margin 0.3s ease 0.1s;
    -moz-transition: margin 0.3s ease 0.1s;
    -webkit-transition: margin 0.3s ease 0.1s;
}

<div class="accordion">
    <ul>
        <li>
            <input type="radio" name="select" class="accordion-select" checked />
            <div class="accordion-title">
                <span>Title</span>
            </div>
            <div class="accordion-content">
                Content
            </div>
            <div class="accordion-separator"></div>
        </li>
        <li>
            <input type="radio" name="select" class="accordion-select" />
            <div class="accordion-title">
                <span>Title</span>
            </div>
            <div class="accordion-content">
                Content
            </div>
            <div class="accordion-separator"></div>
        </li>
        <li>
            <input type="radio" name="select" class="accordion-select" />
            <div class="accordion-title">
                <span>Title</span>
            </div>
            <div class="accordion-content">
                Content
            </div>
            <div class="accordion-separator"></div>
        </li>
        <li>
            <input type="radio" name="select" class="accordion-select" />
            <div class="accordion-title">
                <span>Title</span>
            </div>
            <div class="accordion-content">
                Content
            </div>
            <div class="accordion-separator"></div>
        </li>
        <li>
            <input type="radio" name="select" class="accordion-select" />
            <div class="accordion-title">
                <span>Title</span>
            </div>
            <div class="accordion-content">
                Content
            </div>
            <div class="accordion-separator"></div>
        </li>
    </ul>
</div>

最佳答案

尝试

.accordion {
  font-family: Arial, Helvetica, sans-serif; border-width: 0px;
  margin: 0;
  height: 100vh;
  width: auto;
}