1

I'm trying to align text on this page : https://m.omegarealm.tk/ (Mobile sub domain specifically)

To the center of the red bar on the top of the screen vertically. The result I'm looking for is the word "test" to be aligned in the center of the nav bar (red bar) vertically.

You can see the CSS that's applied to the page here: https://assets.omegarealm.tk/mobile.css

Edit: Don't worry about the CSS Indentation, its being compressed by cloudflare. On the server it's indented

Exitium
  • 21
  • 5
  • possible duplicate of [How can I draw vertical text with CSS cross-browser?](http://stackoverflow.com/questions/1080792/how-can-i-draw-vertical-text-with-css-cross-browser) – Apoorv Awasthi May 10 '15 at 20:01

1 Answers1

0

http://jsfiddle.net/teobzpv3/

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
div{
    position: relative;
    background: #f00;    
    padding: 25px;
}
div p {
  position: absolute;  top: 50%; left: 50%;
  -webkit-transform: translate(-50%,-50%);
   -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);    
}
<div>
    <p>Text</p>
</div>
Dmitriy
  • 4,475
  • 3
  • 29
  • 37
  • Slight issue, I need to implement this into my current CSS, the container is #navbar, you can see it at https://assets.omegarealm.tk/mobile.css – Exitium May 10 '15 at 19:56
  • http://jsfiddle.net/pxwt8krs/ or http://jsfiddle.net/kg7mL2e6/ – Dmitriy May 10 '15 at 20:02