Matt
Matt

Reputation: 231

Centering Logo on Responsive site

I would like the logo and the image slider to center on my responsive site.

Basically, the logo and the slider are next to each other on a full size screen. I can make the slide disappear when the site isn't wide enough and the logo shrinks.

What I want to do is make the logo and the slider center once they are no longer next to each other.

Please help: http://ranchocordovaeventscenter.com/

Thank you,

Matt

Upvotes: 1

Views: 300

Answers (3)

Sam Denton
Sam Denton

Reputation: 465

the given answers will only work if you use both of them, centring with margin: 0 auto; only works if a width is specified, and having a div just display as a block will not change the appearance. Try the css:

div {
  width: 500px;
  margin: 0 auto;  }

along with other styling, and it should center

Upvotes: 0

Touhid Rahman
Touhid Rahman

Reputation: 2583

Put the logo and slider in a div and give it a fixed width. If this div has #inner id, the solution will be:

#inner {
width:1000px;
display:block;
}

Upvotes: 1

Andres Lowrie
Andres Lowrie

Reputation: 170

You can center the child elements of hgroup tag by setting margin: 0 auto;text-align:center on the hgroup

this will cause the contents to be centered within that div

Upvotes: 1

Related Questions