Why does my logo look so pixelated?

• 

  3delamadrugada · Member · Dec 30, 2014 at 3:36 pm

  • Copy link
  • Add topic to favorites

  i did substituted my logo image in the main mage using this css:

  .single .hsContent h2, #header-branding h2 {
  	background: url('//cajoneradecojones.files.wordpress.com/2014/12/ai-ecce-logo-web-2015.gif?w=333') no-repeat scroll 0 0 transparent;
  	padding-top: 80px;
  	position: relative;
  	top: 0;
  }

  the image i uploaded is 300 pp, and 1600 px wide… so, why does my gif image look so pixelated? can i do something to make it look better?

  thanks in advance.

  The blog I need help with is: (visible only to logged in users)

• 

  3delamadrugada · Member · Dec 30, 2014 at 10:18 pm

  • Copy link

  nothing can i do? it really looks awful… :/

• 

  thesacredpath · Member · Dec 30, 2014 at 10:40 pm

  • Copy link

  Let’s tweak your background declaration a little.
  background: url("//cajoneradecojones.files.wordpress.com/2014/12/ai-ecce-logo-web-ok3.gif") no-repeat scroll 0 0 / auto 80px transparent;

  What I have done is to remove the ?w=333 at the end of the URL and then I added some sizing (the / auto 80px part). By doing that, we are working off of the original image rather than a 333px wide copy.

• 

  3delamadrugada · Member · Dec 30, 2014 at 10:50 pm

  • Copy link

  omg!

  now it looks so pretty that i can’t even believe it.
  thanks a lot thesacredpath! as many times before, you’ve made my day.
  happy end of the year.

• 

  thesacredpath · Member · Dec 31, 2014 at 2:07 am

  • Copy link

  You are welcome, and happy new year to you too. :)