Ask HN: Why can't I see downvote or upvote arrows anywhere? | Hacker News Reader

Ask HN: Why can't I see downvote or upvote arrows anywhere?

164 pointsaviraldg57 comments

New CSS?

  @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
    .votearrow { background-size: 10px; background-image: url("grayarrow2x.gif"); }
  }

  .rotate180 {
    -webkit-transform: rotate(180deg);  /* Chrome and other webkit browsers */
  …

It wasn't like that before, there were only gray{arrow,down}.gif

Forced refresh should help.

Why can't pg use css triangles? They are vector look pretty when zoomed in or on scaled displays.

This makes upvote a CSS triangle. Could be extended for downvotes as well.

    /* 13.328px = 1em */
    .votearrow[title=upvote] {
        background: none !important;
    }
        .votearrow[title=upvote]:after {
            content: '';
            display: block;
            position: relative;
            top: -1px;
            width: 0;
            height: 0;
            border: .3em solid transparent;
            border-bottom: .6em solid #999;
        }

I considered these, but just like unicode glyphs, there are a lot of places they don't work.

Forced refresh did work. Thanks.

Looking good on retina now!

Thanks so much. The problem's fixed for me.

Ah, nice to have high-DPI voting arrows finally.

Would be nice if the favicon was similarly updated.

I'm seeing a retina favicon on my retina MBP in Chrome.

Ah, had to explicitly reload favicon.ico itself to get the old one to stop being cached.

I'm using the windows black theme(black background, white letters) , and forced refresh didn't solve it. Is there something else to do , or it needs to be changes at the server ?

Reload the CSS file: https://news.ycombinator.com/news.css

Was having that problem, changed that, and it worked.

Putting something into this URL could help.

I don't recall off the top of my head -- does a ?1 on the end of a URL force re-fetching always, or would the browser re-fetch news.css?1 once and then subsequently use the cached version?

If it always forces re-fetch, then an alternative is to bake the timestamp or hash into the filename (so news-1382794165.css), and update the html generation to point to the new timestamp/hashed file name. Then the browser will fetch newly generated css (etc) exactly once (modulo cache eviction/clearing), and without a force-refresh.

the latter (fetched once) , but different behaviours in browser/proxies made foo-xx.css a more reliable trick

Or the one I prefer, /Static/<vXX>/Css/Style.css.

You rewrite all /Static/<vXX>/* URLs on the serverside to /Static/*. You could create a helper function which inserts the version number in URLs for static files, and use relative paths for images in the CSS file.

I like that too, seems cleaner

I don't like "Css" though. If it's an acronym it should either be all capitalized or all non-capitalized.

Maybe an update across css js htlm not synced up due to caching issues? Evidence: enforcing a full reload (ctrl-r in chrome) reloads the page and the arrows reappear. Also in the last few days the word "upvote" used to flash on the page before being replaced by the arrow indicating some css/js sorcery at work ;)

This worked for me.

I thought my account had been restricted, and came to post this exact question too

Aaaand they're back.

slinks off into the shadows

If anyone is still not seeing them, do a hard refresh (Ctrl+F5).

Ctrl+F5 is amazing, how have I been developing websites without knowing this?

In Chrome at least, having the devtools panel open[0] disables {all,most,some,infuriatingly inconsistent} parts of the cache system, so every refresh is a 'hard refresh'[1].

[0] Might be an option in the dev-tools settings, but I think it's enabled by default.

[1] Except when it's not, of course.

This is true, and I always have that option checked.

But if I am on a site that seems to be loading the old cached stuff during my regular browsing of the internet (not building stuff) I always open dev tools and refresh to do a "hard" refresh.

But learning that CTRL-F5 does the same thing is really neat, and I feel very silly at the same time!

You should also do CSS versioning if you are pushing to a live website, like main.css?v=2 or something so that users (well, mainly nitpicky clients) will always see the latest.

command - R for Firefox on OS X

command - shift - R on Chrome\OS X

Shift + Cmd + R (on Chrome,OSX)

We need to reload the New-CSS-file, because that older-version i.e stale-CSS file is causing this issue!

How to fix it?

Copy-Paste the above into your address bar & Reload HN. The new CSS file will be Rendered and issue fixed.

Hope that helps. :)

Ctrl + F5 should work.

I normally append "?v=1.5" to my css and javascript files to allow for easy cache updating. Then just manually increase the version when you've made changes.

I have never seen a downvote button on my account and always assumed it was a privilege attached to a certain level of Karma.

Someone enlighten me please

You are correct. However even users who should see downvote arrows did not see up or down arrows this morning. But a force-refresh fixed this.

Who are the users who should see downvote arrows?

I don't know the exact rules, but it looks like it's a certain quantity of karma points. If so, it's more than 200, and less than 1200.

I got my downvote arrows at 500 karma

when I had karma above about 800 or 900, downvote arrows appeared. This was recently. the exact number changes to allow for "karma inflation".

Karma inflation, eh? How does that come about?

Is it the result of HN becoming more popular? More readers and same size front page means more readers per post, so more votes per post, so an individual accumulates karma more quickly?

yes

You need 500 karma for the downvote button AFAIR.

Been sitting just below the threshold forever...I really should make a point of commenting more rather than just reading.

I couldn't see them for comments too. Did a hard refresh (ctrl+f5), and they came back. Probably some CSS change.

I think they made it high res now

For Safari users, hold down shift and click the reload button. (Might work on other platforms as well).

Ctrl-R on Windows Chrome did the job for me.

Another age old, useful feature that is absent from the "modern" mobile ecosystem. Copy-Paste loves company.

How about changing those arrows from images to symbols? As far as I remember there has been posts about this same topic earlier.

Doesn't work in a surprising number of places. You simply can't count on people/devices having decent fonts.

Is it just me, or is there more padding between posts too?

Command + R (If you're on a Mac)

or whatever you do to refresh.

Nothing is working. Chrome on Mac

You might need to clear your browser cache.

Related issue regarding the new CSS https://github.com/HackerNews/HN/issues/5

This is extremely relevant: https://github.com/HackerNews/HN/issues/5

Does this affect browser extensions or mobile/web applications which were developed for Hn?

Your lucky enough to post. My account has actually been banned from posting anything new. All I can do is comment and vote. I can't submit.

same here

Reply on news.ycombinator.com