Home/ Questions/Q 8917295
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-15T05:27:06+00:00

I’m using cssgrid.net which is a 12col 1140px responsive fluid framework and I’m having

  • 0

I’m using cssgrid.net which is a 12col 1140px responsive fluid framework and I’m having trouble centering things.

My website has a “background-size: cover;” image and I have a logo that I want to center horizontally within the browser, even when it’s resizing.

This is the HTML I have:

<div class="container">
<div class="row">
    <div class="fourcol"></div>
    <div class="fourcol">
        <div class="logo"></div>
    </div>
    <div class="fourcol last"></div>
</div>

And the CSS:

.logo {
        background: url(../images/logo_retina.png) no-repeat;
        background-size: 175px 175px;
    }

This is what the top portion of my site looks like:
enter image description here

The logo starts in the second set of 4 columns like it should, but how do I make it centered within that set of 4 columns, even when resizing?

Please keep in mind coding is just a hobby.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Assuming that each div.fourcol has the same fixed width I think that background: url(../images/logo_retina.png) no-repeat center middle; should help. If they are floating one another with width set to auto then it will be problem as div.row may be wider than the cumulative width of div.fourcol.

    • 0