Re: How do you position a DIV central in another DIV?
Posted: Thu Feb 04, 2016 7:41 am
A community of PHP developers offering assistance, advice, discussion, and friendship.
http://forums.devnetwork.net/
Code: Select all
<style>
.home-left
{
font-size: 1.2em;
position: relative;
}
.home-left h3
{
margin: 0px;
padding: 0px;
text-transform: uppercase;
font-family: 'Titillium Web', sans-serif;
font-weight: 300;
text-align: center;
color: #A4781C;
font-size: 25px;
}
.home-left h2
{
margin: 0px;
padding: 0px;
text-transform: uppercase;
font-family: 'Titillium Web', sans-serif;
font-weight: 300;
text-align: center;
color: #A4781C;
font-size: 25px;
}
.home-left-text
{
width: 48%;
float: left;
position: relative;
height: auto;
}
.home-left-text-inner {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
/* unnecessary styling properties */
max-width: 50%;
text-align: center;
margin: 0px;
padding: 0px;
}
.home-left-image
{
text-align: left;
float: right;
width: 50%;
margin-left: 10px;
position: relative;
}
.home-left-image img
{
width: 100%;
display: block;
}
</style>
<div class='home-left'><a href='/url'>
<div class='home-left-text'><img src='/images/pages/home-yacht1.jpg' class='home-text-trans'/>
<div class='home-left-text-inner'><h3>interior applications</h3>
Welcome text here to be dynamic and have lots of content on this page and look so nice and special your code and my text and design how can this,
</div>
</div><div class='home-left-image'><img src='/images/pages/home-yacht1.jpg' id='home-stoneselector-image'/></div>
<div style='clear: both' ></div></a>
</div>
Yep. Safari is the new IE. Yay front end!simonmlewis wrote:Oddly, using that method doesn't work terribly well on Safari.