stylish css selector hide everything except img

Question

I am having firefox stylish addon.

I want to know the css rule which will show only the images in images.google.com when searched for.

from firebug i found the css slector for the img tag is

html body#gsr.srp div#main div#cnt.mdm div#rcnt div.col div#center_col div#res.med div#search div#ires ol#rso li div#rg div#rg_s div.rg_di a.rg_l img.rg_i

I tried

*:not(html body#gsr.srp div#main div#cnt.mdm div#rcnt div.col div#center_col div#res.med div#search div#ires ol#rso li div#rg div#rg_s div.rg_di a.rg_l img.rg_i){display: none;}

But that does not work and i found that :not(...) can only take simple selectors.

the other way is to

html{display: none;}

html body#gsr.srp div#main div#cnt.mdm div#rcnt div.col div#center_col div#res.med div#search div#ires ol#rso li div#rg div#rg_s div.rg_di a.rg_l img.rg_i{display: block;}

but this hides everything and shows nothing.

Answer 1

Why not try

html body * {display: none;}
html body#gsr.srp div#main div#cnt.mdm div#rcnt div.col div#center_col div#res.med div#search div#ires ol#rso li div#rg div#rg_s div.rg_di a.rg_l img.rg_i {display: block;}

Answer 2

I found display cannot work instead use visibility. BUt in visibility it will also leave gaps.