Home > DeveloperSection > Forums > How to verticly align an object
Anurag Sharma
Anurag Sharma

Total Post:40

Posted on    June-01-2015 12:42 AM

 .NET C#  ASP.Net 

 1 Reply(s)
 506  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:') +

                                '//www.google.com/cse/cse.js?cx=' + cx;

                                                        var s = document.getElementsByTagName('script')[0];

                                                        s.parentNode.insertBefore(gcse, s);







Pooja Malohtra
Pooja Malohtra

Total Post:47

Posted on    June-01-2015 1:08 AM

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.

Don't want to miss updates? Please click the below button!

Follow MindStick