How to center objects / text verticaly in my div?

hidrau
hidrau used Ask the Experts™
on
Hello guys

I have this page:

http://www.teachmenow.com.br/guardasol/cardapio.html

as you can see, the word " menu " on the left is not centered verticaly, how to do that. I tried many things but any success so far.

thanks
Alex
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Jim RiddlesPrepress/OMS Specialist
Commented:
Actually, the word "Menus" in the upper left of your page is centered, within it's container.  You have assigned the containing DIV a class of voltamenu.  That class is defined in CSS as follows:
.voltamenu {
    width: 100px;
    height: 70px;
    float: left;
    text-align: center;
}

Open in new window

You have defined the containing box for your H3 tag as a fixed width, and set to float left.  The page is doing exactly what you told it to do.

What is the final output you are trying to achieve?
Most Valuable Expert 2017
Distinguished Expert 2018
Commented:
You can add this rule

.voltamenu h3 {
	line-height: 70px;
}

Open in new window

Jim RiddlesPrepress/OMS Specialist

Commented:
Ah, missed the part about vertically centered.  Good catch Julian.

Author

Commented:
Thanks a lot for your help
Most Valuable Expert 2017
Distinguished Expert 2018

Commented:
You are welcome.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial