Установите автоматическую высоту и ширину в CSS / HTML для разных размеров экрана
я имею2 вопроса с этим макетом :(
.feature_content
серый фонАдаптируй этоs высота и ширина для разных размеров экрана. Прямо сейчас на больших экранах.feature_content
далеко от нижнего колонтитула.Есть горизонтальная полоса прокрутки, которую я хочу удалить независимо от размера экрана.Я бы хотел : адаптироваться.feature_content
на оставшуюся высоту и удалите горизонтальную полосу прокрутки.
ВотFIDDLE
И мой код:
HTML:
Header added just for demonstration purposes
Your content goes here
Footer here
CSS:
* {
padding: 0;
margin: 0;
border: 0;
outline: 0;
}
body, html {
width:100%;
min-height: 100%;
}
div {
height:100%;
width:100%;
border:5px solid black;
}
#header {
background-color:orange;
}
#container {
background:blue;
margin: 0 auto;
position: relative;
height: auto !important;
}
#content {
background:pink;
padding-bottom: 100px;
margin: 0 auto;
position: relative;
}
#footer {
bottom: 0;
box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.4);
height: 70px;
left: 0;
position: fixed;
z-index: 100000;
background:green;
}
.featured_content {
min-height: 750px;
max-height: 750px;
width:200px;
background-color:grey;
position:fixed;
margin:auto 0px;
margin-top: 150px;
}