Fix header so that it's always vertically centered

This commit is contained in:
Sébastien Lucas 2013-05-16 12:26:41 +02:00
parent 546e37cd8e
commit c8c0f80eeb
2 changed files with 19 additions and 6 deletions

View file

@ -159,7 +159,9 @@
<img src="<?php echo getUrlWithVersion("images/home.png") ?>" alt="<?php echo localize ("home.alternate") ?>" /> <img src="<?php echo getUrlWithVersion("images/home.png") ?>" alt="<?php echo localize ("home.alternate") ?>" />
</a> </a>
<img class="headright" id="searchImage" src="<?php echo getUrlWithVersion("images/setting64.png") ?>" alt="Settings and menu" /> <img class="headright" id="searchImage" src="<?php echo getUrlWithVersion("images/setting64.png") ?>" alt="Settings and menu" />
<div class="headcenter">
<h1><?php echo htmlspecialchars ($currentPage->title) ?></h1> <h1><?php echo htmlspecialchars ($currentPage->title) ?></h1>
</div>
<div id="tool" <?php if ($withToolbar) echo 'style="display: none"' ?>> <div id="tool" <?php if ($withToolbar) echo 'style="display: none"' ?>>
<div style="float: left; width: 60%"> <div style="float: left; width: 60%">
<form action="index.php" method="get"> <form action="index.php" method="get">

View file

@ -79,10 +79,21 @@ header {
float: left; float: left;
} }
.headcenter
{
float:none;
margin:auto;
text-align:center;
height:70px;
display:table;
}
header h1{ header h1{
float:none; display: table-cell;
padding-top:25px; vertical-align: middle;
text-shadow: 0px 4px 3px rgba(0,0,0,0.4), text-align: center;
line-height: 100%;
text-shadow: 0px 4px 3px rgba(0,0,0,0.4),
0px 8px 13px rgba(0,0,0,0.1), 0px 8px 13px rgba(0,0,0,0.1),
0px 18px 23px rgba(0,0,0,0.1); 0px 18px 23px rgba(0,0,0,0.1);
} }