[WP] Any fix for Chrome?

by 16 replies
19
Hey all.

Look at these screenshots:

Firefox/IE/Opera/Safari:



Chrome:



I hope you get what my problem is. I don't want that mag style posts in Chrome. Any fixes?

Thanks
Karan
#website design #chrome #fix
  • Hi Karan

    The most basic advice I can give you without going into your code is make sure you add the CSS Tools: Reset CSS to your site.

    I find this code sometimes fixes cross browser issues without needing to do much else.

    Laurence
  • To Laurence :

    Hey.

    Thanks for the advise, but I have tried it and it doesn't work.

    Karan
    • [1] reply
    • Open your stylesheet, find the .entry class and remove the
      "position:relative;"

      Current code:
      Code:
      .entry {
float:left;
overflow:hidden;
padding:5px 10px  0 15px;
position:relative;


}
      try this:
      Code:
      .entry {
float:left;
overflow:hidden;
padding:5px 10px  0 15px;


}


  • @Harrison:

    Thanks man. But it doesn't work either.
    • [1] reply
    • There are some end and open tags missing. Use the W3C validator to find were they are and start closing them.
      http:// validator.w3.org/check?uri=http%3A%2F%2Fwww.geekzu.com%2F&charset=% 28detect+automatically%29&doctype=Inline&group=0

      Also, the header profile of your page is missing. (<head profile="http://gmpg.org/xfn/11">).
      You only have the closing tag </head>.
  • @Harrison:

    I have used the validator. But, I can't figure out what the problem is. For ex:



    I have updated the header now!
    • [1] reply
    • I see you have updated the header. I'll check the results on w3c.
      I'll keep posting the issues.

      1- Line 197, Column 294:
      Code:
       <a href=http://www.geekzu.com/page/65/>
      should be
      Code:
       <a href="http://www.geekzu.com/page/65/">
      2 -Line 237, Column 102:
      Code:
      <img  src="http://www.geekzu.com/wp-content/uploads/2010/03/rss-48.png"  class="alignleft" alt="Email">
      Should be:
      Code:
      <img  src="http://www.geekzu.com/wp-content/uploads/2010/03/rss-48.png"  class="alignleft" alt="Email" />
      3- Line 262, Column 33:
      Code:
                  <div class="akpc_report" rel="">
      Should be:
      Code:
                  <div class="akpc_report" >
      4- Line 197, Column 35:
      Code:
              <a href='http://www.geekzu.com/'class='current'>
      should be:
      Code:
              <a class='current' href='http://www.geekzu.com/' >
      That will help fixing some of the issues. However it is important to find out the missing openings for some Divs as you can see at the end of the validator: http:// validator.w3.org/check?uri=http%3A%2F%2Fwww.geekzu.com%2F&charset=% 28detect+automatically%29&doctype=Inline&ss=1&grou p=0&No200=1&user-agent=W3C_Validator%2F1.767
  • ^^I have started fixing some of them. The errors have reduced by some 60%. Just 15 more to go.
  • Ok. Update:

    I tried a lot of codes, a lot of edits but the problem isn't solved. Chrome still is the pain. Any fixes?
    • [ 1 ] Thanks
    • [1] reply
    • Remove position:relative; from .content on line 19.
  • ^^Doesn't work!!
    • [1] reply
    • Have you tried removing (line 19) float:left ?

      Are you actually editing the file online, and not a tmp copy on your drive? Sometimes you'll think you're editing the online file, when actually you're editing a copy in your local tmp directory. What editor are you using?

      Is it possible to disable caching on Chrome?

      Safari 5 is doing the same thing as Chrome.
      • [1] reply
  • @dwaser: Thanks a heck lot man! I added the width and reduced the padding a bit, and it works great!

    Thanks a lot.

    Karan
    • [1] reply
    • You're welcome. I'm glad it worked.

      Daniel
Join the discussion

Next Topics on Trending Feed