Center Google Form Using CSS

Question

I have embedded the google form on my website, which is wrapped inside a div. I am trying to focus it on CSS, but it does not work. Is there any way to accomplish this task?

My code is:

#googleForm { margin-left: auto; margin-right: auto; } 

 <div id="googleForm"> <iframe src="https://docs.google.com/forms....></iframe> </div> 

Answer 1

You can add text-align: center to the element with id googleForm . You can also safely remove margin-left and margin-right :

 #googleForm { /*margin-left: auto;/* /*margin-right: auto;*/ text-align: center; } 

 <div id="googleForm"> <iframe src="https://docs.google.com/forms....></iframe> </div> 

If you want to use margin: 0 auto , you must set the width of the element:

 #googleForm { width: 304px; margin: 0 auto; } 

 <div id="googleForm"> <iframe src="https://docs.google.com/forms....></iframe> </div>