0
我想垂直對齊2個div - 頁面底部的頁腳div（距離底部大約15px頁邊距），以及內容div頁面中心）。該網頁將作出迴應。她是在頁面的jsfiddle： https://jsfiddle.net/tyvodoh0/1/在頁面底部設置div而不與另一個div在較小的屏幕尺寸上重疊
<div class="wrapper">
<div class='center'>
<div id='content'>
<div id='profile_pic'>
<img src='http://www.keenthemes.com/preview/metronic/theme/assets/global/plugins/jcrop/demos/demo_files/image1.jpg'/>
</div>
<div id='information'>
<h1>Title</h1>
<h2>Subtitle</h2>
<p> 4
down vote
favorite
Does the position of the sun in a hollow earth scenario affect the way light scattering would "color" the sky?
My understanding is the reddish-orange color during sunrise/sunset is caused by the sun being at a more oblique angle in contrast to the standard blue when the sun is fully up.
My intuition states that the sky's color wouldn't change much, or if it did would become a washed out version of whatever it normally would be, ie blue on Earth. The most dramatic coloring that I could imagine would be a gradient from say blue to red as you look from the center of the sky to the horizon, given an Earth colored sun and atmosphere. I doubt the gradient scenario is possible, but it would be neat if it was.
</p>
</div>
</div>
<div class='footer'>
<p>
Div to be set at bottom
</p>
</div>
</div>
</div>
/* css */
h1 {
color: #3a2a0c;
font-size: 47px;
text-transform: uppercase;
margin-bottom: 14px;
}
h2 {
color: #3a2a0c;
font-size: 28px;
text-transform: capitalize;
margin-bottom: 14px;
}
h3 {
color: #926d55;
font-size: 15px;
margin-bottom: 40px;
}
p {
color: #3a2a0c;
font-size: 15px;
text-align: justify;
line-height: 110%;
border-bottom: 1px solid #caccc6;
}
hr {
border-color: #3edf4f6;
margin-top: 50px;
}
.wrapper {
background-color: rgba(255,255,255,0.9);
padding: 0;
margin: 0;
top: 0;
left: 0;
display: table;
position: absolute;
height: 100%;
width: 100%;
}
.center {
display: table-cell;
vertical-align: middle;
background: pink;
float: none;
}
#content {
margin-left: auto;
margin-right: auto;
width: 1235px;
background: red;
}
#profile_pic {
width: 396px;
padding-right: 33px;
float: left;
background: blue;
}
#profile_pic img {
width: 396px;
height: auto;
}
}
#information {
width: 806px;
background: yellow;
float: left;
}
#contact {
font-size: 15px;
color: #926d55;
}
.hide {
display: none;
}
#contact span {
margin-right:22px;
}
#information p {
padding: 40px 0;
}
#left {
float: left;
}
#right {
float: right;
}
.links {
padding-top: 15px;
font-size: 15px;
}
.links img {
margin-right: 6px;
}
.links a {
margin-left: 6px;
margin-right: 6px;
color: #3a2a0c;
}
.links a:last-child {
margin-right: 0px;
}
.links a:hover {
color: #926d55;
}
.footer {
float: none;
position: absolute;
top: 90%;
}