I want to Center one div and float other right using any GetSkeleton. How do I do it using GetSkeleton or any other responsive framework?
My question is similar to this one Center one <div> and float other right but I am using GetSkeleton so the contents stack vertically on mobile devices.
i figured it out
<style type="text/css">
.Menu {
position: absolute;
margin-top: 8%;
right: 5%;
}
ul.Menu {
-webkit-padding-start: 0;
padding: 0;
padding-left: 0px;
margin-left: 0px;
list-style-type: none;
}
ul.Menu li {
font-size: 1.2em;
font-weight: bold;
}
@media screen and (max-width: 400px) {
.Menu {
position: relative;
margin-top: 0%;
right: 0px;
}
ul.Menu li {
position: relative;
right: 0px;
text-align: left;
text-align: center;
}
}
</style>
<div class="row">
<div class="twelve columns" style="margin-top: 2%; text-align:center;">
<img src="Content/images/logo.png" alt="Logo" style="width:15%; min-width:150px;" />
</div>
<ul class="Menu">
<li>About us</li>
<li>Careers</li>
<li>Contact us</li>
</ul>
</div>