How to verticly align an object

Total Post:40

C#  ASP.Net 
 1117  View(s)
Rate this:

I'm using a table which contains an H3 inside. Inside that H3 there is a google search bar. Now the google search bar is alligned at the top of the H3. How can I vertically allign it so it's centered? This is what I have at the moment:

<td id="Vak1.3"><h3>
                        <script type="">
                                                    (function () {
                                                        var cx = '013446364428343597193:qtxsarco2zs';
                                                        var gcse = document.createElement('script');
                                                        gcse.type = 'text/javascript';
                                                        gcse.async = true;
                                                        gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
                                '//' + cx;
                                                        var s = document.getElementsByTagName('script')[0];
                                                        s.parentNode.insertBefore(gcse, s);

  1. Post:47

    Re: How to verticly align an object

    Generally spoken, its no longer a good practice to design a website with a table. This doesn't mean that tables are bad in general. That said you could put your searchbar into a div:

    <div id="container">your searchbar here..</div>

    That div can be vertically (and horizontally) aligned easily with:

    #container { 
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;   

    If you want to have only vertical alignment you can change:

    margin-top: auto;

    margin-bottom: auto;

    But be patient that position: absolute is always related to the next parent element, which got the position element.

      Modified On Apr-09-2018 11:39:55 PM