Width of content

• 

  kacperpokorski · Member · Jun 3, 2015 at 11:39 pm

  • Copy link

  Ehh. So its not in the center. If i put the code like You gave me but change the width to my screen resolution 1280 it is ok only on such displays. On Yours the whole content is centered except logo. It’s moved more to left and huge white space on right side of logo :/

  Is it possible to make it centered no matter how big the display will be?

• 

  thesacredpath · Member · Jun 4, 2015 at 12:19 am

  • Copy link

  Given the nature of your image, I’m not sure what to center it on. I can center Enjoy Life, or center the whole thing, but if I center the whole thing, then visually it looks off since the right end is lighter in weight than the left end.

  Do you want it visually centered above the menu items, or physically centered between the left and right edges of the window?

  You can try replacing the .site-logo-link rule I had given with the following.

  .site-logo-link {
      background: transparent url("https://kacperpokorski.files.wordpress.com/2015/05/cropped-nowe-logo-bloga61.png") no-repeat scroll 80% top / cover;
      height: 230px;
      margin-left: auto !important;
      margin-right: auto !important;
      position: initial;
      transform: none;
      width: 90%;
  }

• 

  kacperpokorski · Member · Jun 4, 2015 at 10:26 am

  • Copy link

  I want logo to be always centered of the page, no matter of screen resolution. On my 1280 i would like to be centered, on Yours, or even on 27 inch Mac.
  I changed the signature on logo, now it’s below ENJOY LIFE centered. Maybe it help to center it.

  The code You gave me above also doesn;t work. It showed me huge logo on the top of menu and small one on the top left corner of the screen :(

• 

  kacperpokorski · Member · Jun 4, 2015 at 10:43 am

  • Copy link

  I give up. Set the header image instead of logo cause logo doesn’t work.

  Maybe it’s possible to make clickable header image which will navigate to main url http://www.kacperpokorski.com ?

• 

  thesacredpath · Member · Jun 4, 2015 at 3:02 pm

  • Copy link

  This CSS that I gave earlier will make the header image clickable.

  .blog-title {
      display: block;
      line-height: 200px;
      top: -230px;
      width: 1440px;
  }
  .blog-title a {
      color: rgba(0, 0, 0, 0);
      display: block;
  }
  .blog-title a:hover {
      color: rgba(0, 0, 0, 0);
  }

  See here for more information on setting that up.