CSS For Bar Graphs

November 21, 2005

Having a working knowledge of XHTML and CSS when developing applications is a big help in knowing what can be done client-side and what should be generated server-side.

Recently we’ve had to tackle some interesting visualizations which we coded in XHTML and CSS. The method we used, while fairly simple, was a big help to the engineer and created a very flexible and inexpensive solution. We thought we would share our solution and code in case anyone else ran against similar situations.

Update

I posted a live example page with everything in tact. So far I’ve only been able to test in Firefox 1.0.7, Firefox 1.5, IE 6, Safari 1.3.3, and Opera 9(TP1). You can view it here.

Basic CSS Bar Graph

This is a simple bar graph we developed for a tool we’re releasing shortly for our client. The concept is simple, utilize the percentage width abilities of CSS to accurately portray a percentage bar graph.

"Image of bar graph

<style>
    .graph { 
        position: relative; /* IE is dumb */
        width: 200px; 
        border: 1px solid #B1D632; 
        padding: 2px; 
    }
    .graph .bar { 
        display: block;
        position: relative;
        background: #B1D632; 
        text-align: center; 
        color: #333; 
        height: 2em; 
        line-height: 2em;            
    }
    .graph .bar span { position: absolute; left: 1em; }
</style>
<div class="graph">
    <strong class="bar" style="width: 24%;">24%</strong>
</div>

Complex CSS Bar Graph

This is a more complex visualization, yet still following the same basic idea. Here the graph is a ‘bad’ to ‘good’ indicator with a marker that travels the length of the color scheme. A lighter bar shade also helps indicate the marker position as it travels from left to right.

"Image of marker graph

<style>
    dl { 
        margin: 0; 
        padding: 0;                     
    }
    dt { 
        position: relative; /* IE is dumb */
        clear: both;
        display: block; 
        float: left; 
        width: 104px; 
        height: 20px; 
        line-height: 20px;
        margin-right: 17px;              
        font-size: .75em; 
        text-align: right; 
    }
    dd { 
        position: relative; /* IE is dumb */
        display: block;                 
        float: left;     
        width: 197px; 
        height: 20px; 
        margin: 0 0 15px; 
        background: url("g_colorbar.jpg"); 
     }
     * html dd { float: none; } 
    /* IE is dumb; Quick IE hack, apply favorite filter methods for 
    wider browser compatibility */

     dd div { 
        position: relative; 
        background: url("g_colorbar2.jpg"); 
        height: 20px; 
        width: 75%; 
        text-align:right; 
     }
     dd div strong { 
        position: absolute; 
        right: -5px; 
        top: -2px; 
        display: block; 
        background: url("g_marker.gif"); 
        height: 24px; 
        width: 9px; 
        text-align: left;
        text-indent: -9999px; 
        overflow: hidden;
     }
</style>
<dl>
    <dt>Love Life</dt>
    <dd>
        <div style="width:25%;"><strong>25%</strong></div>
    </dd>
    <dt>Education</dt>
    <dd>
        <div style="width:55%;"><strong>55%</strong></div>
    </dd>
    <dt>War Craft 3 Rank</dt>
    <dd>
        <div style="width:75%;"><strong>75%</strong></div>
    </dd>
</dl>

Vertical CSS Bar Graph

In this third example, we utilize the same principle vertically and reproduce it multiple times to create a more complex graph. This particular solution was a relief the to client and engineer as all they had to do was calculate percentages, and the look of the graph was much better than their stock graphing component.

"Image of vertical bar graph

<style>
    #vertgraph {                    
        width: 378px; 
        height: 207px; 
        position: relative; 
        background: url("g_backbar.gif") no-repeat; 
    }
    #vertgraph ul { 
        width: 378px; 
        height: 207px; 
        margin: 0; 
        padding: 0; 
    }
    #vertgraph ul li {  
        position: absolute; 
        width: 28px; 
        height: 160px; 
        bottom: 34px; 
        padding: 0 !important; 
        margin: 0 !important; 
        background: url("g_colorbar3.jpg") no-repeat !important;
        text-align: center; 
        font-weight: bold; 
        color: white; 
        line-height: 2.5em;
    }

    #vertgraph li.critical { left: 24px; background-position: 0px bottom !important; }
    #vertgraph li.high { left: 101px; background-position: -28px bottom !important; }
    #vertgraph li.medium { left: 176px; background-position: -56px bottom !important; }
    #vertgraph li.low { left: 251px; background-position: -84px bottom !important; }
    #vertgraph li.info { left: 327px; background-position: -112px bottom !important; }
</style>
<div id="vertgraph">
    <ul>
        <li class="critical" style="height: 150px;">22</li>
        <li class="high" style="height: 80px;">7</li>
        <li class="medium" style="height: 50px;">3</li>
        <li class="low" style="height: 90px;">8</li>
        <li class="info" style="height: 40px;">2</li>
    </ul>
</div>

We hope you enjoyed our examples and find new uses and variations for the concept. Drop us a line if you have any other interesting visualizations using XHTML and CSS and we’ll post them here.

Published on November 21, 2005
Resides in CSS/XHTML

Comments feed | TrackBack URI

499 Responses to “CSS For Bar Graphs”

  1. 1

    Matthew Anderson on November 22nd, 2005

    Nice. of course, it’s so obvious, now that you mention it ;) I wish I would have that of that 2 years ago when I was tweaking that Crystal Reports web interface!

  2. 2

    Timmargh on November 22nd, 2005

    Excellent! I feel the need to invent a reason to use these …

  3. 3

    Watcher on November 22nd, 2005

    Yeah, so simple and obvious… when you steal the idea from an ex-coworker. Thanks for generously sharing this code you didn’t write.

  4. 4

    Ryan Nichols on November 22nd, 2005

    ???

    Since each of these projects are all new and unreleased, and I haven’t worked with anyone outside of Apples To Oranges for nearly a year, I can’t imagine why you’d think we stole anything. I can barely remember past last week. (shrugs)

  5. 5

    Baldo on November 22nd, 2005

    great css examples :)

  6. 6

    Spencer Joplin on December 5th, 2005

    You should use relative measurement units (% and em) to create scalable charts for accessibility and flexibility. I think this is html/css charts’ greatest strength.

  7. 7

    Ryan Nichols on December 6th, 2005

    Very true. This code was exact rips out of our client work. (hence the names of the images we used are still intact :) ) Most of them reside in a fixed column, but I’m sure they could be adopted to completely scale.

  8. 8

    Luke L on December 6th, 2005

    I used a system very simialar to this when I did a re-design for http://www.modstats.com.

  9. 9

    topfunky on December 6th, 2005

    That’s awesome.

    A Ruby on Rails helper to generate this would be very useful.

    Puts on TODO list

  10. 10

    Raanan Avidor on December 6th, 2005

    I think you’ve mixed .(classes) and #(ids) in the Basic CSS Bar Graph example.

  11. 11

    Adi on December 6th, 2005

    Nice, but for some dynamic data it needs a dynamic css.

  12. 12

    Loopion on December 6th, 2005

    Excellent !!! Really useful !

  13. 13

    Ryan Nichols on December 6th, 2005

    Hey thanks!

    Raanan: Got it, fixed!

    Adi: You could probaby assign an id and include a stylesheet that is fed dynamically from the server. The stylesheet would have rules with all the correct values for that given graph.

  14. 14

    Freddy on December 6th, 2005

    This is excellent! It’s funny you did that, because recently I was wondering how I could do somethin similar, but you saved me the trouble! :-)

    Excellent stuff, really! cheers mate

  15. 15

    Dave on December 6th, 2005

    Nice work and thanks for sharing!! In respect of the dynamic data, surely, as the method uses inline styles for the percentage, couldnt that be set as a variable? Or am i missing something?

    Thanks again.

  16. 16

    Deny on December 6th, 2005

    aha.. this is a really nice css bar graph :) thanks a lot for sharing, guys.

  17. 17

    boB on December 6th, 2005

    first example doesn’t work in Safari, unless I’ve mis-pasted and then mis-typed, and then re-mis-pasted/typed. Even tried wrapping it in a simple XHTML doc template.

  18. 18

    Dan on December 7th, 2005

    I’ll echo boB’s remark and say that the first example doesn’t work in Safari – it also doesn’t work in Firefox. You’ve fallen into the trap of thinking that IE is the only browser that matters, guys…

  19. 19

    Ryan Nichols on December 7th, 2005

    You sure about that? I just copied the first set of code, ploped it on a page and opened in FF. The application it came from also works in FF and Safari.

    Maybe I’ll make more of an official example page tomorrow and remove all the positioning style that we used for the project.

  20. 20

    Dan on December 7th, 2005

    Yes, I’m sure. I tried with Firefox 1.0.7 for OS X, Safari 2.0.2, and Firefox 1.0.7 under Windows XP. Only IE displayed the graph correctly using the example given.

    I did make it work in all of them, though. Hopefully the posting software won’t mangle this example – if so, sorry. There’s no preview button :-) Basically, I took advantage of the convenient 200px size of the div and figured that means 1% = 2px. So I take the %, multiply by two, and size the div in pixels rather than %. This works on all the browsers I tested.

    My example looks different than yours, but the principle is the same.

    .graph { width: 200px; } .graph .bar { text-align: center; line-height: 1.2em; }

    16%

  21. 21

    Mike Ward on December 7th, 2005

    I did a very simple one of these just 3 weeks ago and I did indeed use a variable to control the bar width. I also set it to change colors at certain levels based on the variable (which ranges from 500 to 850).

    Here is the css for the graphic bar;

    graph {

    <% if Request.queryString(“barWidth”) < 900 then%>

    background: #390;
    <%end if%>
    <%if Request.queryString(“barWidth”) < 700 then%>
    background: #FF0;<%end if%>
    <%if Request.queryString(“barWidth”) < 575 then%>
    background: #F00;
    <%end if%>
    margin: 8px 0 0 0;
    padding: 0;
    height: 20px;
    width: <%=(Request.queryString(“barWidth”)-500)%>px;
    filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;
    }

    It probably could have been even easier but I did it quick.

    If anyone is interested in seeing the entire thing just let me know.

  22. 22

    Mike Ward on December 7th, 2005

    I posted the example if anyone is interested;

    http://mikewarddesign.com/demo/bargraph.asp?barWidth=600

    Change the last three digits to anything between 501 and 849.

  23. 23

    Kim Fransman on December 7th, 2005

    Nice! Im using a simular approach in a meeting room booking service, where i use javascript to calculate the width and position in a calendar.

    but now that i saw this im thinking og taking more advantage in the power of css.

  24. 24

    Paul on December 7th, 2005

    Tip: use script.aculo.us (http://script.aculo.us) to make the bar graphs really dazzle. People will think it’s Flash, and that ain’t bad.

  25. 25

    ben scott on December 7th, 2005

    thought this is a great idea and got round to collecting a few links that are of use for many academics (science infomatics)

    some of these links need firefox as they are rendering in CSS3

    http://apples-to-oranges.com/blog/article.aspx?id=55 bar graphs

    http://andreas.web-graphics.com/footnotes/#ftn1 footnotes in css3

    http://www.brandspankingnew.net/specials/footnote.html#note1 footnotes in css2

    http://www.surfare.net/~toolman/temp/diagram.html CSS diagrams

    http://meyerweb.com/eric/tools/s5/ slideshow like powepoint http://www.robertnyman.com/2005/11/13/proudly-presenting-ajax-s/ done with xml as well

    http://www.cssplay.co.uk/menu/old_master.html image maps for rollover information

    http://www.ericmeyeroncss.com/projects/13/ some useful styles for getting a web document to look like a book (sit archives as bottom of page)

    http://www.alistapart.com/articles/boom printing it all up as a book at the end

  26. 26

    Ryan Nichols on December 7th, 2005

    Paul: Not a bad idea. I just updated with a live working sample. I’ll add an animation effect to them as an experiment.

  27. 27

    Anders Floor on December 7th, 2005

    FYI, my Internet Explorer 6.0 crashed (no response) when loading this page. Tried it again and again it crashed (no response).

    Specs: WinXP SP2 IE 6.0.2900.2180.xpspsp2gdr.050301-1519

    Of course Mr Gates should be blamed for this but with over 80% of the web users still using Internet Explorer, it’s a serious issue. Unfortunately I don’t have time to debug the code to find out what’s causing the crashes.

  28. 28

    max on December 7th, 2005

    I tried something akin to this for a really lame CS course last year. We had to do a poll. I made scaleable CSS result bars.

    http://www2.cems.uvm.edu/~mlawton/cs148/assign4/index.html

    Enjoy. Anyone’s welcome to steal every last bit of it if they want. Sorry I forgot to share the source code for this assignment.

  29. 29

    Son Nguyen on December 7th, 2005

    For IE, if the % is small, the bar will be the same between say 10% and 0.1%

  30. 30

    proph3t on December 7th, 2005

    Implemented my own version of this on my site, http://www.gamegum.com

    Thanks for the help, I never thought of this for some reason. To see it on the site you will need to login though.

  31. 31

    proph3t on December 7th, 2005

    Yeah, noticed that in IE the bar visually wont go smaller than the width of the percent text inside it.

  32. 32

    Ryan Nichols on December 7th, 2005

    Ah, yeah ok. We already tackled that issue in the app a few days ago. I’ll update the example code. Thanks!

  33. 33

    Me on December 8th, 2005

    Nice.

    The first and the third example aren’t very accessible thou. The data is only useful, if you can read the text on the background images. If you are blind or a search engine robot, you can’t. Not recommended.

  34. 34

    Oren T on December 8th, 2005

    How about using slants for creating 3D bars?

    http://www.infimum.dk/HTML/slantinfo.html

  35. 35

    Martin (fv) on December 8th, 2005

    I noticed Mozilla (Gecko) has serious issues with percentages near ANY_NUMBER.5 %. Absolute positioning from the bottom goes nuts (the bar is 1px higher then others). I had to check for this and change (truncate) the value.

    Besides I used tables with divs positioned relatively agains td’s. Thus I could set widths and spaces within css, not server-side code.

  36. 36

    Jo on December 8th, 2005

    allthough you’re blog layout “crashes”; the bar graph examples get displayed nicely in IE5.5

    Very nice work

  37. 37

    Ryan Nichols on December 8th, 2005

    Thanks!

    The blog layout and the crashing is probably due to using Dean Edwards IE7 scripts. It’s tests ok with our IE 6, but with the wizardry going on in that script I wouldn’t be surprised if it wasn’t 100% stable.

    I have to admit though, it was like a dream to be able to use the full power of CSS and not worry about IE rendering improperly. (but I guess crashing!) One day it will be a reality :)

  38. 38

    Justin Greer on December 8th, 2005

    These are beautiful! Perfect for some of the stats systems we’re putting together.

    However, I’ve been looking at that last example — the vertical bar graphs, and something bothers me about it. The fact that you’re using pixels rather than percentages for those bars. (Then again, there’s the fact that the “8″ bar is more than half the height of the “22″ bar.)

    Anyway, I’ve done some hacking on it, and figured out that you can put a “graph area” div in there that’s used as a basis for scaling the bars themselves (since it is the size of the actual area where the graph bars go). Then you can set the scale of the UL to 100% and make it positioned, so the height of the LI elements can be a percentage of it.

    What’s especially nifty about it is that if you make the UL absolute positioned on the bottom, and set the graph area to hide overflow, you get to then scale the graph to an arbitrary max height by simply setting the height of the UL in its style attribute. (So to make the max height be 22%, you’d set the UL height to 100/0.22 = 454% — one calculation, not one per bar.)

    So… With all that, you want to see an example, right? I put up a little post showing the full source and an example: http://groups.apu.edu/webcave/archives/14/

  39. 39

    tamster on December 8th, 2005

    Seems to be working on Opera too (9.0 TP1)..

  40. 40

    q00p on December 10th, 2005

    Opera 8.51 works fine as well…

  41. 41

    Bill on December 10th, 2005

    Kudos! That’s a neat piece of css code! What I would add to it is a script to automatically generate the graph code for both the screen and the printer. I’m sure a lot of people want the ability to print the whole graph with colors, bells and whistles.

  42. 42

    Linklog on December 10th, 2005

    CSS Bar Graph is used in Drupal 4.6.4′s polls.

  43. 43

    Justin Shearer on December 10th, 2005

    I just was faced with the same type issue. Except I had to go a bit further. I had to make it where the value could be changed on the fly. http://justinshearer.com/AJAX/slider/ It will eventually be tied into some type of ajax/java application I am contributing on at work.

  44. 44

    Lorelle on December 10th, 2005

    I created simple CSS bar graph experiments at http://www.cameraontheroad.com/index.php?p=159 a long time ago, creating interesting backgrounds as well as charts, and you can find more similar designs at Web Page Design for Designers: Drawing with CSS ( http://www.wpdfd.com/editorial/wpd0104review.htm ) that are lovely.

  45. 45

    karlo on December 10th, 2005

    echt fettisch.de!

  46. 46

    proph3t on December 10th, 2005

    Anyone find a fix to the problem in IE in which it displays any percantage that is visually smaller than the actual width of the text inside that bar to be as big as that text?

  47. 47

    miscblogger on December 10th, 2005

    hey thats pretty nifty. i ought to use it for my next web design.

  48. 48

    Ryan Nichols on December 11th, 2005

    Thanks!

    proph3t: Yes! I updated the above code and the live example page to fix the issue. It involves adding extra markup to do it, but it works.

  49. 49

    Weiran on December 11th, 2005

    Excellent design! The complex CSS bar graph is extremely well done! With the number of really inaccurate dynamic bar graphs you see on the net, its a wonder no-ones thought of these before.

    FYI: they work perfectly in Opera 8.51.

  50. 50

    Stu Nicholls on December 12th, 2005

    I produced this method back in July using a standard definition list.

  51. 51

    Stu Nicholls on December 12th, 2005

  52. 52

    demimismo on December 12th, 2005

    Nice!

    I have done an alternative using unobstrusive Javascript http://www.mildiez.net/archivos/2005/12/12/graficos-de-barras-con-css-y-javascript/

  53. 53

    Viktor on December 19th, 2005

    Great stuff, but there is alot of code for making a thing that you can do with php 2d.

  54. 54

    Darcie on December 20th, 2005

    I have been working on this for over a year. You have some nice code, nice designs. I have been developing the code so it can be LESS so its more so to speak.

    I have examples littered throughout my site and blog … http://swatchnot.hender-son-s.com/percentbars.html http://swatchnot.hender-son-s.com/blog

    Does it validate? I am asking about the first sample.

    I notice you use . not # If one was to use more than one marker on a page, would it still validate? My tests have not worked so far. Each project requires its own # and I have not had much luck with .

    KUDOS

  55. 55

    Jonny on December 21st, 2005

    Great. Love these charts, however I can’t get the vertical bar chart to display correctly if it has a value less than about 10% in IE. The other charts seem to work fine. Any ideas?

  56. 56

    Ryan Nichols on December 28th, 2005

    Stu Nicholls – Nice examples. But what’s with the use of the >b< tag? :)

    demimismo - That's a good addition to keep it all client side. It's often real nice to tell engineers 'Just spit it out in a unordered list, I'll take it from there.' They tend to like that too :)

    Jonny - You're right. Follow the IE hack on the basic bar graph. You have to wrap the data in a dummy

  57. 57

    John on December 28th, 2005

    Excellent article!

  58. 58

    Evadman on December 30th, 2005

    With the rendering problem in IE: You can ‘stack’ 2 li elements, one with the color, one with the text, and use a negative margin to position the elements on top of one another. background Color element first, then text element, or the bar color will be over the text. You can also use the Z axis.

  59. 59

    Stefan on December 31st, 2005

    great idea … i’ve always used an image and played with its width, but i think i’m gonna try it with styles next time

  60. 60

    Denis on December 31st, 2005

    awesome stuff ! Have a small project that needed this type of graph.

  61. 61

    Leftovers on January 3rd, 2006

    Really nice stuff, I already designed some dynamic bar graphs with php.

  62. 62

    gshack on January 7th, 2006

    really great! i start to wonder if there is a way to make graphs using css as i am about to add one to my current project; just in time. thx.

  63. 63

    topfunky on January 11th, 2006

    A helper for Ruby on Rails in now available:

    http://nubyonrails.topfunky.com/pages/css_graphs

  64. 64

    geewj on January 11th, 2006

    Thanks for the tutorial. It helped a lot!

    I added one thing to the last graph that people might use.

    on g_colorbar3.jpg I used a gradient of a color from light to dark. I made mine about 4 times the height I expect my largest bar to be.

    and then on this line…

    vertgraph li.critical { left: 24px; background-position: 0px bottom !important; }

    and assuming you bar was at 50% of the graph change it to..

    vertgraph li.critical { left: 24px; background-position: 0px 50% !important; }

    This will adjust the the background vertically by 50%, so the smaller bars will have a darker background.

  65. 65

    abator on January 17th, 2006

    Great article! I will use it in my next project. Thank You!

  66. 66

    Cyril on January 17th, 2006

    It is nice indeed.

    But for the vertical graph, I’m screwed if I don’t apply the CSS, as the ‘critical’, ‘high’, etc. information is a CSS class…

  67. 67

    Dan on January 20th, 2006

    Just wondering if anyone has attempted to create a graph using embbeded lists? For example:

     
      • Montreal
      • 55
      • 15
      • Toronto
      • 25
      • 60

  68. 68

    JP on January 20th, 2006

    i cant get the bars to print on the printer, is there a way to correct this problem?

  69. 69

    XoticStar on January 26th, 2006

    tHx 4 dá TiP!¡

    Check this Mega PHP souRce for generate MegaNice graph bars !¡…

    http://www.graphpico.com/

    totally GPL License ¡¡

  70. 70

    fabien. on January 27th, 2006

    Great article. I have used it on my website, if you wanna see its implementaion(s) : http://www.feub.net/ (scroll at the bottom) and in the Ailleurs part : http://ailleurs.feub.net

    Thank you ! f.

  71. 71

    Roman Reisenberger on February 2nd, 2006

    great css examples!

  72. 72

    ANGEL on February 18th, 2006

    Excelent, it`s a good solution

  73. 73

    martin on February 18th, 2006

    maybe you should change in the first example “span” for “strong” in css code.. mwhahaha nobody noticed

  74. 74

    Ninjaplease on February 21st, 2006

    Hello all,

    I was able to implement the second complex graph using similar images in place of gmarker, gcolorbar, etc.

    However, my gmarker keeps overwriting the colorbar giving a white gap along the sides of the gmarker’s thin middle black line.

    How would I make it so that the g_marker drawing doesn’t completely overwrite the colorbar and insert the white areas?

  75. 75

    web dude on February 28th, 2006

    Wow this is great but has anyone had a go at creating a pie-chart? Is this possible?

  76. 76

    Mr. Khmerang on March 9th, 2006

    An alternative approach if you need to have printable graphs: http://www.khmerang.com/index.php?p=118

  77. 77

    rweait on March 24th, 2006

    Your examples are beautiful, and funny. I’ve been trying to extend this to apply to tables with arbitrary end-pooint data, as shown in the link. Am I missing the obvious?

  78. 78

    Marko on March 28th, 2006

    Very nice. I guess you don’t need Photoshop to drow :)

  79. 79

    Comin on April 5th, 2006

    Good, but for some dynamic data it needs a dynamic css. Ty !

  80. 80

    chris on April 7th, 2006

    man fuck yall

  81. 81

    Anil on April 15th, 2006

    Thnx for the bar chart, I was searching for a level meter, which shows in realtime the depth of a queue(JMS). I used your bar graph and AJAX + servlet to do this, everything worked fine and i can see indicator going up and down as i flood and drain the queue in real time. The only issue was a flckering as the chart is reloaded every 2 seconds, can we make it more lightweight so that the motion can be fluid?

  82. 82

    Philip on April 21st, 2006

    Loves it!

    Made it dynamic with a bit of PHP and MySQL…very nice.

  83. 83

    Samantha on April 21st, 2006

    Pure beauty! The graph works great on Opera 8.54 for Windows.

  84. 84

    Bryan on April 22nd, 2006

    Anil.. I believe you can use a few of the effects from script.aculo.us to give your site a slightly better transition of your graphs

  85. 85

    nuther web dude on May 8th, 2006

    web dude – yes, I believe pie charts are possible, based on Eric Meyer’s slantastic code: http://www.infimum.dk/HTML/slantinfo.html

  86. 86

    klaas debeuf on May 11th, 2006

    i’m having problems with the vertical bars in IE6.0 , I’m designing a poll with de css_graphs plugin in Ruby on Rails. i’m loading the graph with ajax and the data , when i check the sourcecode IE doesn’t load the < style>..< /style> ,so the graph isn’t shown , only the data , in firefox it just works fine. Somebody know any solution or had the same problem?

  87. 87

    Jini Jose on May 12th, 2006

    fine i like the bar graph thank u

  88. 88

    melanie on May 31st, 2006

    i need data for a graph

  89. 89

    frank mati on June 4th, 2006

    i love graphs

  90. 90

    Alex Paul on June 7th, 2006

    Wow! nice graph. Thanks.. :)

  91. 91

    BalusC on June 15th, 2006

    Another examples for CSS graphs: http://balusc.xs4all.nl/srv/sta-srv.php (vertical) http://balusc.xs4all.nl/srv/sta-srv-pag.php (horizontal)

  92. 92

    Barbara on July 20th, 2006

    Great work!
    My homepage | Please visit

  93. 93

  94. 94

    TipClique Tutorials - Drixer on July 26th, 2006

    Thanks for the great tutorial Ryan, it has been linked to by my site “TipClique Tutorials”:http://www.tipclique.com. I hope to see more in the future.

  95. 95

    Daniel on August 4th, 2006

    I note your article only one point because link demo is broken. That teach you a lesson !

  96. 96

    das on August 6th, 2006

    das

  97. 97

    » Diagramme und Charts erstellen: wie und wo? - Dr. Web Weblog on August 6th, 2006

    [...] CSS For Bar Graphs beschreibt einen weiteren Ansatz für die Erzeugung der Graphen mit CSS und XHTML. [...]

  98. 98

    Imran Hashmi on August 15th, 2006

    Excellent work

  99. 99

    Ionut Marinescu on August 16th, 2006

    great job but please fix the example link

  100. 100

    Ryan Nichols on August 18th, 2006

    Example link fixed! Sorry for that…

    Daniel can we get our points back now? :)

  101. 101

    Stephan Miller » CSS Bar Graphs on August 19th, 2006

    [...] Apples To Oranges – San Francisco Bay Area Visual and Experience Design Studio [...]

  102. 102

    James on August 19th, 2006

    All of these examples also work in Konqueror 3.4.3

  103. 103

    Brandon on August 19th, 2006

    The Complex CSS Bar Graph would be a wonderful complement to script.aculo.us drag’n'drop. That could open up an amazing amount of possibilities for client-tweakable UIs, generated on the fly.

  104. 104

    Glow in the Dark · links for 2006-08-19 on August 19th, 2006

    [...] CSS for bar graphs (tags: tutorial css webdev WebDesign) [...]

  105. 105

    Brendan on August 19th, 2006

    Very cool!

    Can change dynamically, too:

    ” onClick=”x = document.getElementById(‘me’).style; document.getElementById(‘me2′).innerHTML = x.width = parseInt(x.width.replace(‘%’, ‘ ‘))+1+’%';”>

                        <strong id="me" class="bar" style="width: 8%;"><span id="me2">8%</span></strong>
    
                    </div>
    
  106. 106

    Brendan on August 19th, 2006

    Attempt2.

                        <strong>8%</strong>
    
  107. 107

    Brendan on August 19th, 2006

    third and final attempt:

    8%

  108. 108

    Joaquín Cuenca Abela on August 20th, 2006

    Nice graphs!

    I used a similar approach a while ago to show a progress bar when you upload a file.

    To me the best part of making it with HTML + CSS is that you can change them dynamically.

  109. 109

    10 daily things » CSS For Bar Graphs on August 20th, 2006

    [...] Here are 3 brilliant examples of Bar Graphs made using CSS. Basic CSS Bar Graph [...]

  110. 110

    Dave P on August 21st, 2006

    With all due respect, this is a horrible idea, for the following reasons:

    1. A bar graph is a table, so there is already a structure available.
    2. In each example, there is information conveyed through CSS that should be conveyed exclusively in the content. Example: style="width: 24%; This violates the separation of content from presentation, and therefore the whole purpose of using CSS in the first place.

    I think it’s a great piece of coding, but I’m concerned that this is just using CSS for CSS’s sake.

  111. 111

    Ryan Nichols on August 21st, 2006

    Dave –

    I can understand where your coming from with your comments. I’m not sure I agree with a table containing the structure of a definition list though. The fine points as to what markup to choose really are, well, fine points.

    When it comes to choosing to do this in CSS versus images, as we stated earlier, it’s about the best overall solution given the factors of time and difficulty. For our work, it was a really simple way to get what we needed that looked good and didn’t require creating dynamic images.

    In terms of including an inline style attribute. You’re right, it’s not ideal. We’re very pragmatic when it comes to these kinds of decisions. I’ll always go with best practices and ideals, but in real world situations, I’ll choose the most practical approach for the problem I’m faced with. Hence we didn’t flinch at including the style attribute dynamically in the XHTML.

  112. 112

    cssdesign.dk » Arkiv CSS Quicklinks (02/2006) on August 27th, 2006

    [...] What with standardists ruling the web trends scene right now, the emergence of a new specification template for CSS is bound to be a major point of consideration in future endeavors. It is not, however, going to be remembered as the be-all and end-all of web design in the current web culture. http://fadtastic.net/2006/08/20/css3-what-it-means-and-what-it-doesnt/ List-u-Like CSS Generator af BrothercakeBut what if you had a tool that gave you detailed control over the appearance of a navigation list, and took account of browser variations itself – so that all you had to do was design it, and the exact CSS would be written for you..? http://www.listulike.com/ CSS for bar graphs af Apples to OrangesThis is a simple bar graph we developed for a tool we’re releasing shortly for our client. The concept is simple, utilize the percentage width abilities of CSS to accurately portray a percentage bar graph. http://applestooranges.com/blog/post/css-for-bar-graphs/?id=55 CSS Inheritance af David DorwardMany newcomers to CSS are confused by inheritance; this is often because they come from a background in object oriented (OOP) programming and expect CSS to work in a similar way. [...]

  113. 113

    Frazzled Faery » Blog Archive » Resource: CSS Links on August 28th, 2006

    [...] Clearance Ten CSS Tricks You May Not Know Updated Simple CSS Tabs My Top Ten CSS Tricks CSS for Bar Graphs Adding a stylesheet to RSS CSS Shorthand Guide CSS Transparency Ten Common CSS Mistakes Block Hover Effect for Links Son of Suckerfish Dropdowns Turning a list into a navigation bar Accessible “more” links v2 footerStickAlt [...]

  114. 114

    feha on September 4th, 2006

    Thank You for great tips.
    I used your idea to create a CSS based PageRank Graph.

    Take a look at:
    http://www.vision.to/CMS/Home/index.php?pid=294

    (better than rendering images :-)

  115. 115

    Smashing Magazine | a magazine for web-designers » List of nifty tools and diagrams on September 10th, 2006

    [...] “CSS For Bar Graphs“ describes another approach for presenting graphs with CSS and XHTML. [...]

  116. 116

    » CSS Quellensammlung CSS - Dr. Web Weblog on September 12th, 2006

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  117. 117

    UX Study | 油茶研究会 » Blog Archive » 一些用来画图表或流程的好工具 on September 18th, 2006

    [...] “CSS For Bar Graphs” describes another approach for presenting graphs with CSS and XHTML. [...]

  118. 118

    Link CSS e AJAX at MyHTML.it on October 4th, 2006

    [...] CSS Bar Graphs [...]

  119. 119

    otro blog ms » Unos cuantos de desarrollo web (XCIX) on October 11th, 2006

    [...] Comencemos con CSS. En el Developer Center de Adobe, un tutorial para el diseño de un layout de tres columnas. Más interesante, un hack para distinguir navegadores, unos gráficos de barras o unos “frames” en CSS. Y una recomendación interesante: cómo crear una guía de estilo para tu sitio. Para cerrar sección, un clásico de la casa: ¡bordes redondeados! [...]

  120. 120

    Kevin on October 13th, 2006

    Hai guys, thought these things could use some animation, ya know, take em to the next level :)

    http://stickmanlabs.com/2006/10/13/animated-javascript-css-graphs

    Enjoy!

  121. 121

    » CSS: Techniques, Tutorials, Layouts » Smashing Magazine | modern magazine for web-designers and developers on October 25th, 2006

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  122. 122

    raghavendra on November 10th, 2006

    this is a nice work.
    i have the data in my excel sheets.
    i have to represent that data in bar charts in the browser preferable internet explorer..

    can you please send some sample code to represent excel sheets data in the form of bar charts in the browser.

  123. 123

    raghavendra on November 10th, 2006

    its great to draw bar charts like this.
    i have the data in excel sheets.
    i have to represent that data in the form of bar charts in internet explorer.
    my email id is ds_raghavendra@yahoo.com
    please help me regarding this issue

    regards
    raghavendra

  124. 124

    ilovesing.com » Archive » CSS相关资源网站 on November 10th, 2006

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  125. 125

    mellowswing on November 10th, 2006

    Hello,
    I was reading your example and i was wondering what was span all about there in the CSS (for the first example) , you forgot to put it in the xhtml ,it should be :

    24%

    Nice work anyway :)

  126. 126

    apan’s Watching » links for 2006-11-23 on November 23rd, 2006

    [...] CSS For Bar Graphs 归类于: .net — apan @ 11:20 pm [...]

  127. 127

    BlogMyth|博客神话之设计类博客 » Archive » css相关资源网站 on November 23rd, 2006

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  128. 128

    Andrew MacKinnon on November 28th, 2006

    I’ve copies and pasted the code without any modifications but whenever it is displayed I keep getting the bullets from

  129. . It doesn’t show up on yours here or with your live examples so it’s not a browser issue.
  130. Any idea what could/would be causing this?

  • 129

    Brandon on January 5th, 2007

    Thanks so much for this, quite a life saver on a non-profit site I’m currently working on. “How can I display a donations so far graph without having to process it all on the server side?”

    For the person getting bullets, put in “list-style-type: none;” on the ul.

  • 130

    Lista de herramientas para crear diagramas, gráficas y diagramas de flujo at Isopixel on January 18th, 2007

    [...] “Gráficas de barra en “ describe otra aproximación a la presentación de graficas en CSS y XHTML. [...]

  • 131

    53 CSS-Techniques You Couldn’t Live Without | Smashing Magazine on January 18th, 2007

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 132

    elearning + webstandards » Blog Archive » 53 CSS-Techniques You Couldnt Live Without on January 21st, 2007

    [...] Die Betreiber von Smashing Magazine -  Sven Lennartz und Vitaly Friedman – haben eine umfassende Linkliste mit sehr interessanten Beispielen für CSS-Techniken veröffentlicht. Eine echte Fundgrube für Webdesigner! CSS Based Navigation Navigation Matrix Reloaded CSS Tabs CSS Bar Graphs (CSS For Bar Graphs) Collapsing Tables: An Example Adams Radio & Checkbox Customisation Method CSS Image Replacement CSS Shadows (CSS Shadows Roundup) CSS Rounded Corners Roundup (Nifty Corners) Drop Cap – Capital Letters with CSS [...]

  • 133

  • 134

    good2see on January 23rd, 2007

    i use the “first graph bar”. Now my poll looks better.
    you will look from here: http://www.zeyram.com (on right side)

  • 135

    James on January 23rd, 2007

    Hey good2see, you should test your site on Firefox too. It looked fine on IE but on Firefox it was a mess :/

  • 136

    Dicas Neosite » Blog Archive » Como criar diagramas, gráficos para seu site. on March 23rd, 2007

    [...] Está precisando criar um diagrama para colocar no seu site e não sabe como fazer isto rapidamente? O site http://gliffy.com possui uma ferramenta on-line e gratuita onde você poderá criar seus diagramas pela internet. Existe outra forma interessante de criar gráficos e apresentações no seu site através de códigos CSS. Veja como fazer isto no endereço: http://applestooranges.com/blog/post/css-for-bar-graphs/?id=55 [...]

  • 137

    Pixelco Blog » Blog Archive » Tutoriales/Recursos on March 24th, 2007

    [...] CSS FOR BAR GRAPHS [...]

  • 138

    better css_graph < first things first, still on March 27th, 2007

    [...] There’s a rails plugin called css_graphs written by Geoffrey Grosenbach over at nuby on rails. It’s a rails helper wrapped around some work making graphs out of xhtml and css. done by the folks at Apples to Oranges. It’s pretty slick. [...]

  • 139

    Better css_graph « first things first, still on March 27th, 2007

    [...] Better cssgraph March 27th, 2007 There’s a rails plugin called cssgraphs written by Geoffrey Grosenbach over at nuby on rails. It’s a rails helper wrapped around some work making graphs out of xhtml and css. done by the folks at Apples to Oranges. It’s pretty slick. [...]

  • 140

    Daniel on March 30th, 2007

    Stunning work, I am using GD to generate graphs for a web application but this looks ten times better.

    Keep up the good work apples.

  • 141

    10 generadores o técnicas CSS útiles para generar gráficos. « Cosas sencillas on April 11th, 2007

    [...] CSS For Bar Graphs: gráfica de barras usando los tanto por ciento que ofrece CSS. [...]

  • 142

    » 25 Code Snippets for Web Designers (Part3) on April 12th, 2007

    [...] CSS Bar Graphs – Create complex Bar graphs using css only [...]

  • 143

    Web Development Resources - denniland.com on April 12th, 2007

    [...] CSS for Bar Graphs [...]

  • 144

    Over 200 Ajax, CSS, Flash, JavaScript, PHP, MySQL, RSS, XML and more tutorials » A blog you can use! on April 19th, 2007

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 145

    53 ultramodern css techniques | A Blog you can use on April 23rd, 2007

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 146

    53 Tecnicas ultramodernas con hojas de estilo (CSS) « on April 25th, 2007

    [...] CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 147

    Le blog » Archive du blog » Bonne feinte ! on May 2nd, 2007

    [...] Si un jour vous avez à faire des petits histogrammes dans une page web, ce tutorial très bien foutu vous aidera. [...]

  • 148

    Le blog » Archive du blog » links for 2007-05-03 on May 2nd, 2007

    [...] CSS (Cascading Style Sheets) For Bar Graphs Un tutorial pour réaliser facilement des histogrammes à grands coups de CSS (tags: css design drawing experiments graph programming visualization web) [...]

  • 149

    Obscene Art :: YACBGA (Yet another CSS bar graph article) on May 5th, 2007

    [...] OK, so I’ve read the existing articles about building bar graphs with CSS. All are great work. But they didn’t exist before I needed such a creature…and now that they all exist, I still need functionality that doesn’t exist in them. What, you might ask, could I possibly need from a bar chart that these examples do not provide? They look good, they’re generally clean, and they work in all (or most) browsers. Ah, well, we’re developing web-based system administration tools, and one of the things we do a lot of (and will be doing a lot more of in the future) is presenting data about the system to the user in a clear graphical form. [...]

  • 150

    Gráficas mediante CSS « Disenia on May 7th, 2007

    [...] CSS For Bar Graphs: gráfica de barras usando los tanto por ciento que ofrece CSS. [...]

  • 151

    Gencer Bilgisayar » Blog Archive » CSS, PHP, flash, AJAX ile grafik ve çizelgeler on May 13th, 2007

    [...] CSS – aşağıdaki resimde gördüğünüz sütunlar css ve Xhtml kullanılarak ortaya çıkarılmış.. Kodlar ve örnekler için. [...]

  • 152

  • 153

    DIS Web Design : 56 CSS Design Tips that a Designer should know at Custom Web Design on June 15th, 2007

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 154

    Tutorials Round-Up: Ajax, CSS, PHP and More on July 30th, 2007

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 155

    sameer on July 30th, 2007

    well i can use this css in many of my sites.
    thanks for this article.

  • 156

    www.50kb.net on August 4th, 2007

    Thankyou!

  • 157

      Güzel Css Grafikler Hazırlamak İstermisiniz. by Sonbe on August 6th, 2007

    [...] İsterseniz tam size göre bi adres. [...]

  • 158

    Nem Blog » 53 CSS Important Techniques on August 8th, 2007

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 159

  • 160

  • 161

      CSS, PHP, flash, AJAX ile grafik ve çizelgeler by # YaMTaR on August 28th, 2007

    [...] CSS – aşağıdaki resimde gördüğünüz sütunlar css ve Xhtml kullanılarak ortaya çıkarılmış.. Kodlar ve örnekler için. [...]

  • 162

    bilgiservisim » 53 mükemmel css örneği on September 3rd, 2007

    [...] 4. CSS Bar Grafik (Bir başka örnek) [...]

  • 163

    SigT on September 9th, 2007

    Barras y gráficas bonitas 100% CSS…

    Andaba buscando una forma de mostrar gráficas y una barras de carga con CSS de la forma más limpia posible (más que nada por no perder tiempo reinventando la rueda) cuando me he encontrado un recurso compatible con la gran mayoría de navegadores y …

  • 164

    Gráficas de barras con CSS « Cosas sencillas on September 9th, 2007

    [...] Gráficas de barras con CSS En Barras y gráficas bonitas 100% CSS encuentro una forma de mostrar gráficas de barras con CSS , la forma más limpia posible, es un recurso compatible con la gran mayoría de navegadores y 100% CSS. Se trata de CSS For Bar Graphs. [...]

  • 165

    GfxDizayn » PHP ve CSS ile “Graph Bar” oluşturun on September 9th, 2007

    [...] CSS deyince ilk aklıma gelen ilk isim andy budd ve CSS Mastery kitabı oluyr. Ama CSS ile yakından ilgilenen eric meyerin yazıları ile muhtemelen aşinadır. Terillada eric meyerin, CSS ve PHP kullanarak grafik bar oluşumu hakkında yazısını gördüm.Benzer yazılar burada ve şurada yer almaktadır. + [...]

  • 166

    Matthew J on September 9th, 2007

    Very nice, this is exactly what I have been needing!

  • 167

    links for 2007-09-10 « toonz on September 10th, 2007

    [...] CSS For Bar Graphs (tags: css graph tutorial) [...]

  • 168

    Creando barras y graficas con CSS on September 12th, 2007

    [...] tiempo, ya jamás se me ocurrió hacer barras graficas con CSS. Gracias a Sigt.net me entere que CSS for bar graphs existía. Y es ahí donde pude aprender a hacer diversos tipos de graficas con CSS. Definitivamente [...]

  • 169

    Barras y gráficas bonitas 100% CSS « El Blog de Mookie on September 12th, 2007

    [...] trata de CSS For Bar Graphs, simple pero es justo lo que [...]

  • 170

    Fatih Hayrioğlu’nun not defteri » 12 Eylül 2007 Web’den Seçme Haberler on September 13th, 2007

    [...] CSS ile yapılmış bar grafik örnekleri. Link [...]

  • 171

    Tropiezos en la red » Blog Archive » Enlaces interesantes #22 on September 13th, 2007

    [...] Grficos y barras en CSS Excelente! (Va). [...]

  • 172

    Tropiezos en la red » Blog Archive » Enlaces interesantes #22 on September 13th, 2007

    [...] Grficos y barras en CSS Excelente! (Va). [...]

  • 173

    Cloud of May » Blog Archive » 53 CSS-Techniques You Couldn’t Live Without on September 14th, 2007

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 174

    OHZE.NET » Cool Charts & Graph with Ajax, jQuery, Javascript Edit on September 19th, 2007

    [...] css for bar graphs simple Bar Graph by css style [...]

  • 175

    Nik Chankov on October 1st, 2007

    Guys, 2 years since the publication is live the CSS graph looking still impressive!

    Very well done!

  • 176

    silent on October 9th, 2007

    this is well css

  • 177

    diarioTHC | Gráficos de barras mediante CSS on October 11th, 2007

    [...] Enlace: CSS FOR BAR GRAPHS [...]

  • 178

  • 179

    things to look at (October 11th - October 13th) | stimulant on October 13th, 2007

    [...] CSS For Bar Graphs [...]

  • 180

  • 181

    Thomas Hansen on October 16th, 2007

    This is just PURE brilliant man :)
    We’ve already started to implement it in http://ajaxwidgets.com (Gaia Ajax Widgets :)

  • 182

    Charts And Graphs: Modern Solutions | Developer's Toolbox on October 18th, 2007

    [...] CSS for Bar GraphsAnother CSS-technique by ApplesToOranges. [...]

  • 183

    Charts And Graphs: Modern Solutions | Blog on October 20th, 2007

    [...] CSS for Bar GraphsAnother CSS-technique by ApplesToOranges. [...]

  • 184

    Charts And Graphs: Modern Solutions on October 24th, 2007

    [...] CSS for Bar GraphsAnother CSS-technique by ApplesToOranges. [...]

  • 185

    CSS, PHP, flash, AJAX ile grafik çizimleri - php & resources on November 8th, 2007

    [...] CSS – aşağıdaki resimde gördüğünüz sütunlar css ve Xhtml kullanılarak ortaya çıkarılmış.. Kodlar ve örnekler için. [...]

  • 186

    53 CSS-Techniques You Couldn’t Live Without | SiNi Daily on November 9th, 2007

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 187

    Tutorials Round-Up: Ajax, CSS, PHP and More - Article Save on November 12th, 2007

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 188

    hereticanthem co.,ltd. » CSSJavaScriptȤäʵ䥵ץ뤬ۤƤ륵ȤΤޤȤ on November 25th, 2007

    [...] applestooranges.com [...]

  • 189

    Anonymous on November 29th, 2007

    BARGRAPHHHHHHHHH

  • 190

    Sauravh Singh Blog » Blog Archive » 53 CSS-Techniques You Couldn’t Live Without on December 4th, 2007

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 191

    i say that | Charts And Graphs: Modern Solutions on December 14th, 2007

    [...] CSS for Bar Graphs Another CSS-technique by ApplesToOranges. [...]

  • 192

    i say that | CSS: Techniques, Tutorials, Layouts on December 14th, 2007

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 193

    i say that | Diagrams: Tools and Tutorials on December 14th, 2007

    [...] “CSS For Bar Graphs” describes another approach for presenting graphs with CSS and XHTML. [...]

  • 194

    Creating bars and graphics with CSS | ARTEgami in English on December 18th, 2007

    [...] myself for a while, I never pictured myself doing bars with CSS. Thanks to Sigt.net I found that CSS for bar graphs actually existed. This this I was able to do many new graphics with CSS. SHARETHIS.addEntry({ [...]

  • 195

    Creando graficas de barras h/v con CSS | frogx.three on December 19th, 2007

    [...] Enlace:  applestooranges [...]

  • 196

    Webmaster 38 » Blog Archive » CSS For Graphs at ajax scripts compound on January 3rd, 2008

    [...] CSS For Graphs [...]

  • 197

    thomasfedb on January 18th, 2008

    This is truly wonderful, i made a joomla plugin based on this beautiful css: http://forum.joomla.org/index.php/topic,243606.0.html

  • 198

    Ruby, APIs y programación web » Innova Desarrollos informáticos on January 21st, 2008

    [...] entre los que está Ruby. Además, me ha llamado también la atención un artículo que explica cómo programar las típicas gráficas de barras en CSS, y un post algo más sencillo en dónde se puede ver cómo hacer las gráficas de [...]

  • 199

    CSS Diagrams, Bar Graphs, Star Rater - The Arts Lab TurkeY on January 31st, 2008

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 200

    Веб-графики на CSS/AJAX/Javascript | Cyrill on February 1st, 2008

    [...] 10. Apples to Oranges: CSS for Bar Graphs [...]

  • 201

    Estadísticas con ASP.NET, AJAX y CSS on February 3rd, 2008

    [...] encontrar una forma de hacerlo en Apples To Oranges. Cuando tenga tiempo, léase después del 19 de Febrero, intentaré hacer una pequeña explicación [...]

  • 202

  • 203

    Websites Reviewer » Blog Archive » CSS based Design - Website Design Tips on February 13th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 204

    Techniques, Tutorials, Layouts | on February 13th, 2008

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 205

    53种网页设计师必备的高级CSS技巧 | 帕兰映像 on February 21st, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 206

  • 207

    Dakshesh on March 6th, 2008

    for first example, where you do not use image as background, I want to use multi-color background bars on same line how do I do that?
    I tried following
    24%
    24%
    but it did not show on same line instead bar2 graph goes to next line? why is that?
    Thanks

  • 208

    CSS Concept » Blog Archive » Techniques, Tutorials, Styles in CSS on March 13th, 2008

    [...] CSS For Bar Graphs [...]

  • 209

    53 Tecniche CSS | Giornale dei blogger Wordpress on March 17th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 210

    Boozox » Enlaces interesantes sobre diseño on March 22nd, 2008

    [...] CSS for bar graphs – Por último, gráficos de barras con CSS [...]

  • 211

    125 Code Snippets for web designers | PaulSpoerry.com on April 1st, 2008

    [...] to build a browser-agnostic crossfading effect using Script.aculo.us, a Javascript effects library CSS Bar Graphs – Create complex Bar graphs using css only Attach icons to anything using CSS – Thanks to CSS [...]

  • 212

    List of CSS Bar Graph & Diagram Techniques | Kollermedia.at on April 3rd, 2008

    [...] CSS for Bar Graphs [...]

  • 213

    サイトでグラフを使いたい時に使えるまとめ | DesignWalker on April 10th, 2008

    [...] 13. CSS FOR BAR GRAPHS | Apples to Oranges [...]

  • 214

    サイトでグラフを使いたい時に使えるまとめ - DesignWalker on April 14th, 2008

    [...] 13. CSS FOR BAR GRAPHS | Apples to Oranges [...]

  • 215

  • 216

    53 CSS-Techniques You Couldn’t Live Without « Gabriel Steinbach on April 23rd, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 217

    CSS Hakkında Siteler Serisi - Seri 1 : Spaksu Blog on April 24th, 2008

    [...] CSS FOR BAR GRAPHS Basit , Komplex ve Dikey CSS çubuk Grafikleri [...]

  • 218

    CSS Hakknda Siteler Serisi - Seri 1 - Keha.Net l Webmaster Platformu l on April 24th, 2008

    [...] CSS FOR BAR GRAPHS Basit , Komplex ve Dikey CSS ubuk Grafikleri [...]

  • 219

    » CSS Hakkında Siteler Serisi - Seri 1 yonetim danışmanlığı ekonomi sermet sandıkcı on April 24th, 2008

    [...] CSS FOR BAR GRAPHS Basit , Komplex ve Dikey CSS çubuk Grafikleri [...]

  • 220

    30 Exceptional CSS Techniques and Examples | Six Revisions on April 24th, 2008

    [...] 24. CSS Bar Graphs: Examples [...]

  • 221

    KMC | Web & Internet Teknolojileri Günlüğü » CSS Hakkında Siteler Serisi on April 25th, 2008

    [...] CSS FOR BAR GRAPHS Basit , Komplex ve Dikey CSS çubuk Grafikleri [...]

  • 222

    Effets en Css pur et Conseils ( sans javascript ) on April 25th, 2008

    [...] CSS FOR BAR GRAPH [...]

  • 223

  • 224

    A whole lot of CSS! | on April 30th, 2008

    [...] – 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 225

    Recursos y Tutoriales » Blog Archive » 53 tecnicas CSS muy bueno on May 6th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 226

    Recursos y Tutoriales » Blog Archive » Super Post CSS on May 6th, 2008

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 227

    Anonymous on May 7th, 2008

    what a joke ha ha.

  • 228

    一些免费的 CSS 统计图 - Movoin Studio on May 17th, 2008

    [...] #4. CSS For Bar Graphs [...]

  • 229

    sandro on May 19th, 2008

    Thanks for share

  • 230

    CSS: 5 possibilités haut de gamme on May 26th, 2008

    [...] un tutorial complet sur la création de graphiques au visuel saisissant, le tout en 100% pur css à partir d’une [...]

  • 231

    bdITjobs.com : : Blog » Blog Archive » Diagrams: Tools and Tutorials on May 27th, 2008

    [...] CSS For Bar Graphs describes another approach for presenting graphs with CSS and XHTML. [...]

  • 232

    Anonymous on May 28th, 2008

    ccz sfbfbbfgfgfgfgffffffffffffffffffffffffffffffffffffffffffffffffffff

  • 233

    shon12 on June 5th, 2008

    hey guy look at this “visifire” it is amazing charting component powered by silverlight.is offered under open source

  • 234

  • 235

    CSS: Techniques, Tutorials, Layouts on June 10th, 2008

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 236

    53 CSS-Techniques You Couldn’t Live Without on June 10th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 237

    Div+Css页面特效代码30个 on June 11th, 2008

    [...] 24. CSS Bar Graphs:Examples [...]

  • 238

    CSS Tricks und Tutorials | Photoclinique on June 12th, 2008

    [...] Ist ein Code-Ersteller. Einfach CSS-Eigenschaften wählen und ein Beispieltext wird angezeigt. CSS Balken-Diagramme, Macht tolle Balken-Grafiken auf deiner Webseite. Email-Adresse vor Spidern verstecken, Das ist [...]

  • 239

    Himanshu’s Weblog » css on June 17th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 240

    Cronaca di un’avventura formativa » links for 2008-06-20 on June 20th, 2008

    [...] CSS For Bar Graphs (tags: css graph tutorial) [...]

  • 241

    Okan DOĞAN - Eğitim Bloğu Dinamo Design Studio » Blog Archive » 30 tane birbirinden güzel css kodu örneği on June 20th, 2008

    [...] 24.Css Barlar Örnekteki gibi barlar yapmak için… [...]

  • 242

    Carmine Nielsen on June 20th, 2008

    neurodiagnosis nomography viscidize vaguity snatching hourly oinochoe viduity
    Farida Wong Dancewear Collection
    http://www.uwmb.org

  • 243

    temizlik şirketleri on June 21st, 2008

    thanks you

  • 244

    coupon on June 21st, 2008

    thanks for this help, it was usefull

  • 245

  • 246

    SEO Dubai on June 22nd, 2008

    SS FOR BAR GRAPHS

  • 247

    temizlik on June 30th, 2008

    thank you…

  • 248

    neeshu on June 30th, 2008

    please what each line does

  • 249

    yulhjhl on June 30th, 2008

    hfjhc

  • 250

    zlori on June 30th, 2008

    It’s a very nice method, but can I see anywhere a live example?

  • 251

    temizlik on July 1st, 2008

    thank you….

  • 252

    Anonymous on July 3rd, 2008

    ewan

  • 253

    Sam on July 6th, 2008

    Hey

    When I copy the code for the Vertical bar chart, why doesn’t it work?

  • 254

    Sam on July 6th, 2008

    How can I add more Bar’s on the Bar graph?

  • 255

    Visualisierung von Statistiken mit CSS - XHTMLforum on July 8th, 2008

    [...] SAC – Simple accessible Charts CSS For Bar Graphs [...]

  • 256

    Google Php Web Dizayn Programlama CSS XML Photoshop Seo MySQL Dhtml Ajax » CSS, PHP, flash, AJAX ile grafik çizimleri on July 9th, 2008

    [...] CSS – aşağıdaki resimde gördüğünüz sütunlar css ve Xhtml kullanılarak ortaya çıkarılmış.. Kodlar ve örnekler için. [...]

  • 257

    三色设计驿站 - 一个设计人用来记录工作,记录生活 on July 15th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 258

    cssmake on July 16th, 2008

    nice code for the Vertical bar chart

  • 259

    dış cephe temizligi on July 22nd, 2008

    thank you…

  • 260

    inşaat sonrası genel temizlik on July 24th, 2008

    thank you…

  • 261

    asansör on August 6th, 2008

    Thank you for sharing…

  • 262

    Pharm29 on August 6th, 2008

    Very nice site!
    [LINK http://c.1asphost.com/topfarm7/749.htmlcheap tramadol[/LINK]

  • 263

    Pharm80 on August 6th, 2008

  • 264

    Pharm89 on August 6th, 2008

    Very nice site!

  • 265

    söve on August 7th, 2008

    Thank you for sharing…

  • 266

    ilaçlama on August 9th, 2008

    Thank you for sharing…

  • 267

    ilaçlama on August 9th, 2008

    Thank you for sharing…

  • 268

    Jaybird’s Blog - 53 CSS-Techniques You Couldn’t Live Without on August 9th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 269

    Pwhndvve on August 9th, 2008

    Thousands and legate left buy cytotec dead hand held.

  • 270

    izmir evden eve on August 14th, 2008

    thank you for sharing

  • 271

    insaat sonrası temizlik on August 19th, 2008

    thank you for sharing

  • 272

    CSS techniques and examples List: Part 1 | Net Feast on August 25th, 2008

    [...] 24. CSS Bar Graphs: Examples [...]

  • 273

    30 Exceptional CSS Techniques and Examples « Jonsunhee’s Weblog on August 29th, 2008

    [...] 24. CSS Bar Graphs: Examples [...]

  • 274

    Joseph Smith on September 2nd, 2008

    It’s so obvious the code doesn’t need any comments… please

  • 275

    webmaster forumu on September 3rd, 2008

    thanks you

  • 276

    10 Challenging But Awesome CSS Techniques « Jonsunhee’s Weblog on September 3rd, 2008

    [...] visual for a group of otherwise boring statistics. Apples to Oranges has found a way to accurately display bar graphs with CSS only. It’s an elegant solution for what would have to otherwise be hardcoded or done with [...]

  • 277

    rosdi on September 3rd, 2008

    I can vouch the bars work on Chrome!

  • 278

    Tomasz Nastulak :: Blog » Blog Archive » Benefi.pl vs. mojegrosze.pl on September 7th, 2008

    [...] Fajny flashowy bajer, ale nie polecany dla osób korzystającej z Opery z włączonym stylem „dostępność”. (Wiem, że w tym momencie nadmiernie się czepiam i pojechałem po całości, bo wiadomo że targetem serwisu nie są osoby korzystające z ułatwień przeglądarek czy czytników ekranów). Wiadomo, że flash wygląda tu bardzo ładnie. Jednak przydałoby się zestawienie w tabeli z tekstem, ot taka dodatkowa opcja typu “pokaż w wersji tekstowej”) - wtedy można sobie skopiować do dalszych obliczeń w innych aplikacjach. Oczywiście jest też możliwość zrobienia wykresów słupkowych w oparciu o CSS. [...]

  • 279

    Bookmarks.WittySparks.com on September 9th, 2008

    CSS For Bar Graphs…

    This is a more complex visualization, yet still following the same basic idea. Here the graph is a ‘bad’ to ‘good’ indicator with a marker that travels the length of the color scheme. A lighter bar shade also helps indicate the marker position…

  • 280

    detailCode on September 21st, 2008

    This will be nice to add to reports in my portfolio of websites.

  • 281

    Chouxinxin on September 21st, 2008

    The design is so great.

  • 282

    Anthony on September 24th, 2008

    css makes our jobs so much easier. thank you for this article it really helped me and my web design business a lot.

  • 283

    Yasar Gokcek - 53 CSS-Techniques You Couldn’t Live Without on September 27th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 284

    Yasar Gokcek - CSS: Techniques, Tutorials, Layouts on September 27th, 2008

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 285

    Webclave.com » Blog Archive » 30 Exceptional CSS Techniques and Examples by Sixrevisions on September 28th, 2008

    [...] 24. CSS Bar Graphs: Examples [...]

  • 286

    53 CSS-Techniques You Couldn’t Live Without « Where LOVE begins on September 30th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 287

    Tutorials Round-Up: Ajax, CSS, PHP and More « Wish Upon a Star on October 1st, 2008

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 288

    Webclave.com » Blog Archive » 53 Tecnicas CSS basicas por Smashingmagazine on October 1st, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 289

    Hernan Giovanni Ramirez Segura on October 6th, 2008

    Help, quiero implementar el estilo de Vertical CSS Bar Graph, pero no se como hacerlo, copio el codigo tal cual… pero no me sale nada en el servidor. Gracias..

  • 290

    irrerourb on October 7th, 2008

    Подскажите шооблончег под WordPress 2.6.2, чтобы был похож на ваш http://www.apples-to-oranges.com.

    Заранее благодарю)

  • 291

    53 CSS-Techniques You Couldn’t Live Without | Yasar Gokcek on October 10th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 292

    Vidhya on October 11th, 2008

    Thank you so much, im new to development, i know only the style tags about css. your code helped me a lot. they are so easy and quick to implement.

  • 293

    72 css hacks and css tricks « The Adventures of Amit Dua on October 12th, 2008

    [...] CSS For Graphs [...]

  • 294

    Anonymous on October 13th, 2008

    thanks a lot very well!

  • 295

    Webdesign Ravensburg on October 13th, 2008

    It`s amazing! Great design! Thank you!

  • 296

    Randal on October 14th, 2008

    Tout simplement excellent, bravo !

  • 297

    Lose the Images: How to Get Rounded Corners, Gradients, Drop Shadows and More Using CSS | Design Vitality on October 16th, 2008

    [...] CSS For Bar Graphs CSS bar graphs using very few images. [...]

  • 298

    Anonymous on October 20th, 2008

    ghfghf

  • 299

    lokendra singh on October 20th, 2008

    cool

  • 300

    izmir evden eve on October 21st, 2008

    thanks..

  • 301

    dekorasyon on October 28th, 2008

    thanks….

  • 302

    53 CSS-Techniques You Couldn’t Live Without | Evolution : weblog on October 30th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 303

    53个你会感兴趣的CSS技术 : Collection on November 6th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 304

    Anonymous on November 13th, 2008

    1
    1
    1
    1
    11
    1
    11
    1
    1

  • 305

    CSS Diagrams Examples | CSS Examples on November 14th, 2008

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 306

    oto kiralama on November 27th, 2008

    thanks..

  • 307

    Tutorials to Draw Charts, Diagrams, Flow Charts | Making CIVIL More Enjoyable on December 3rd, 2008

    [...] CSS For Bar Graphs describes another approach for presenting graphs with CSS and XHTML. [...]

  • 308

    CSS Way » 53 CSS-Techniques You Couldn’t Live Without on December 3rd, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 309

    göğüs büyütücü on December 3rd, 2008

    thanks..

  • 310

    Diagramme und Charts erstellen: wie und wo? | Dr. Web Magazin on December 3rd, 2008

    [...] CSS For Bar Graphs beschreibt einen weiteren Ansatz für die Erzeugung der Graphen mit CSS und XHTML. [...]

  • 311

    Gögüs Büyütücü on December 4th, 2008

    thanks..

  • 312

  • 313

    精选30个优秀的CSS技术和实例at ThinkiP! on December 7th, 2008

    [...] 24.CSS柱状图:实例 [...]

  • 314

    fictivedesign.com » Blog Archive » 53 CSS-Techniques You Couldn’t Live Without on December 10th, 2008

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 315

    esrgk on December 16th, 2008

    superrrrrrrrrrrrrrr!

  • 316

    Site With The Lamp » Wordpress Chart Plugin on January 3rd, 2009

    [...] Wouldn’t it be nice if the monthly archives could be displayed in the form for a chart? Unfortunately there isn’t a plugin to do that. Well at least there wasn’t one till now. I have just created a very basic plug-in it still needs a bit more work so I am not going to release it just yet. It’s made entirely of CSS and javascript and I was inspired to build it after stumbling into this : http://applestooranges.com/blog/post/css-for-bar-graphs/?id=55 [...]

  • 317

    CSS Quellensammlung on January 5th, 2009

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 318

    nanu on January 23rd, 2009

    great work thanks

  • 319

    Mort on February 5th, 2009

    Great art! Thanks!

  • 320

    Ethos Blog » CSS Unleashed on February 12th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 321

    Free Templates on February 14th, 2009

    Hello, this is a great tutorial, but I can’t set up the vertical css graph.

  • 322

    Tutorials Round-up: AJAX, PHP, CSS and more.. « Tempting Magazine on February 17th, 2009

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 323

    Diagrams: Tools and Tutorials « Rohit Dubal on February 21st, 2009

    [...] CSS For Bar Graphs describes another approach for presenting graphs with CSS and XHTML. [...]

  • 324

    zichzach on February 22nd, 2009

    This looks great. Thanks for the tutorial.

  • 325

    WARLOCK on February 27th, 2009

    Почитал, порадовало :) А может и действительно всегда думать исключительно о хорошем, а все плохое переворачивать?

  • 326

    VietNam PHP Blog » Blog Archive » 53 kỹ thuật CSS ko thể bỏ qua on February 28th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 327

    Tutorials Round-Up: Ajax, CSS, PHP and More | Web design, graphic design resource and JavaScript code library on March 28th, 2009

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 328

    Федор on April 3rd, 2009

    Ну естественно, действительно так оно и есть. :)

  • 329

    http://www.scriptremix.com/ on April 6th, 2009

    CSS For Bar Graphs…

    Having a working knowledge of XHTML and CSS when developing applications is a big help in knowing what can be done client-side and what should be generated server-side….

  • 330

    克兰印象 » 53种网页设计师必备的高级CSS技巧 on April 6th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 331

    erken rezervasyon on April 11th, 2009

    Thanks

  • 332

    erken rezervasyon on April 11th, 2009

    Thansk

  • 333

    CSS Quellensammlung 2 on April 12th, 2009

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 334

    tatil otelleri on April 17th, 2009

    Thanks

  • 335

  • 336

    Hans on April 23rd, 2009

    You can also use the old “slants” hack to pull off area charts.

  • 337

    Эммануил on April 24th, 2009

    Без дела жить — только небо коптить. :)

  • 338

    Think Studio » Blog Archive » 30 Exceptional CSS Techniques and Examples on April 25th, 2009

    [...] 24. CSS Bar Graphs: Examples [...]

  • 339

    raj on April 27th, 2009

    great this is very helpful to my next web project. thanks again . nice bar graphs

  • 340

    guidesigner.net » Free CSS Graph Resources, easy to use and customiz. on May 5th, 2009

    [...] CSS For Bar Graphs [...]

  • 341

    guidesigner.net » Free CSS, PHP, flash and AJAX charts on May 5th, 2009

    [...] As much as I hate filling a form I love seing a chart. I don’t know why. It can show a lot of things. We use charts to see our progress, to see our income, loses, gains, this versus that, he versus me, us and them etc. It’s like when we were little kids and asked our dad who’s stronger…the lion or the tiger. We feel like there’s the answer…in that chart right in front of us. Facts besides words, numbers over presumptions…visual results. If you know how to play with parameters, it’s your map of the future. There’s the road…look at last year how wrong you did :) . It’s funny I know…imagination is the limit. We searched and researched and found some nice examples with various charts. In PHP, CSS, AJAX or Flash here’s our list. Have fun! CSS for bar graphs [...]

  • 342

    Google Chart API y Gráficas con Javascript, CSS, PHP… « Telematica & Linux on May 13th, 2009

    [...] CSS For Bar Graphs, el concepto es simple y muy antiguo se le da un porcentaje al ancho de las etiquetas y conseguiremos sencillas gráficas. [...]

  • 343

    Anonymous on May 13th, 2009

    It`s so cool

  • 344

    CSS web design techniques to die for | Web Templates, SEO, Web Design Tutorials, Tips, Guides - DT Blog on May 14th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 345

    53 CSS-Techniques You Couldn’t Live Without | Tarak Thakore on May 25th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 346

    Graphs and charts — starting points « Puuhatun hoito on June 6th, 2009

    [...] CSS for bar graphs [...]

  • 347

    彭明德 on June 10th, 2009

    很好

  • 348

    tripwire magazine | tripwire magazine on June 25th, 2009

    [...] CSS Bar Graphs [...]

  • 349

    izmir matbaa on June 29th, 2009

    thasnk

  • 350

    CSS Tehnike, Tutorijali i Lajoti | DIZAJN CENTAR on July 1st, 2009

    [...] CSS BAR GRAFIKA [...]

  • 351

    Dellemente Net-Magazine » Blog Archive » 53 CSS -Techniques You Couldn’t Live Without on July 4th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 352

    53 CSS-Techniques You Couldn’t Live Without « Ramesh on July 8th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 353

    Tecnicas e exemplos de CSS | ivanBogar.com | design e wordPress on July 10th, 2009

    [...] 14. Creating a graph using percentage background images Itens usando porcentagem com imagens. 15. CSS Bar Graphs: Examples 3 exemplos de graficos em barras. 16. A CSS-based Form Template Exemplos de formulários [...]

  • 354

    53 CSS-Techniques You Couldn’t Live Without | Rystereology on July 20th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 355

  • 356

    Graphs and charts — starting points « Mongertaa tekniikan kanssa on August 12th, 2009

    [...] CSS for bar graphs [...]

  • 357

    53 CSS-Techniques - Themeflash : One Stop For All Your Web Resources on August 12th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 358

    53 CSS-Techniques You Couldn’t Live Without | Pdf Search colection on August 14th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 359

    Top CSS Techniques | psd2css on August 17th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 360

    Graphique en CSS | Flying Stones on September 7th, 2009

    [...] Voici quelques exemples de graphique en pur css et html trouver ici. [...]

  • 361

    Are you want to create CSS Bar Graphs and Star Rater? on September 8th, 2009

    [...] Bar Graphs ApplestoOranges CSS For Bar Graphs CSS For Bar [...]

  • 362

    sandrar on September 10th, 2009

    Hi! I was surfing and found your blog post… nice! I love your blog. :) Cheers! Sandra. R.

  • 363

    53 CSS Techniques You Couldn't Live Without | The PhenixbluE on September 15th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 364

    new blog » Blog Archive » 一些不错的CSS相关资源网站(全E文的) on September 23rd, 2009

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 365

    Diagrams: Tools and Tutorials « All Sites on September 25th, 2009

    [...] CSS For Bar Graphs describes addition access for presenting graphs with CSS and [...]

  • 366

  • 367

    53 Técnicas de CSS que você não pode viver sem - Ralph Almeida – SEO, Otimização, Design on September 30th, 2009

    [...] 4. Gráfico de Barras em CSS (CSS For Bar Graphs) [...]

  • 368

    Tutorials Round-Up: Ajax, CSS, PHP and More | 9Tricks.Com - Tips - Tricks - Tutorials on October 2nd, 2009

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 369

    30 Exceptional CSS Techniques and Examples | Theme Center on November 19th, 2009

    [...] 24. CSS Bar Graphs: Examples [...]

  • 370

    30 Exceptional CSS Techniques and Examples @ tipBOX.net on November 23rd, 2009

    [...] 24. CSS Bar Graphs: Examples [...]

  • 371

    [PHP & MySQL] Umieszczanie wykresów na stronach www ( porada, tutorial, artykuł, jak zrobić ) on November 25th, 2009

    [...] CSS for bar graphs – prosty generator wykresów słupkowych, dwuwymiarowych. Wymagania: JavaScript. Działa pod różnymi przeglądarkami (Firefox +1.0, Internet Explorer +6, Safari +1.3 i Opera +9), przykład działania [...]

  • 372

    css精品设计14款 - 耕堂 on November 27th, 2009

    [...] 3.css动态条形图 可以显示百分比的条形图,很实用,柱状图也可以; [...]

  • 373

    Pol Moneys on November 30th, 2009

    this is useful and sweet. thank you, you made my day.

  • 374

    53 CSS-Techniques You Couldn’t Live Without | Theme Center on December 13th, 2009

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 375

    30个精选优秀的CSS实例 | 伟景博客 on December 29th, 2009

    [...] 24.CSS柱状图:实例 3款柱状图实例:使用div和列表标签的”基本CSS柱状图”、”复杂CSS柱状图”、”垂直CSS柱状图”。 [...]

  • 376

    Yoke Lee on December 30th, 2009

    Hey, your blog is spammed!

  • 377

    53 kỹ thuật CSS ko thể bỏ qua | 7Click | Ket Noi & Chia Se Thong Tin | 7Click.co.cc on January 6th, 2010

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 378

    53种网页设计师必备的高级CSS技巧 | Web启点 on January 10th, 2010

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 379

  • 380

    53 técnicas esenciales de estilos CSS | Cosas sencillas on January 15th, 2010

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 381

    A Comprehensive CSS Development Guide For Beginners & Experts « deCode10 – trends, technologies & more … on January 17th, 2010

    [...] Here is a place where you can learn how to create graphs using CSS. [...]

  • 382

    10 fantastic CSS-Techniques « EWS on January 18th, 2010

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 383

    53 công nghệ CSS mà bạn không thể thiếu on January 22nd, 2010

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 384

    53 công nghệ CSS mà bạn không thể thiếu | Vietnam Developer Club on January 27th, 2010

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 385

    53个CSS技巧 | UX Garden on January 30th, 2010

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 386

    53 CSS-Techniques You Couldn’t Live Without | Neuron Technologies Inc on January 31st, 2010

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 387

    CSS实例教程:基本型CSS条状图表- 西米CC on February 2nd, 2010

    [...] 原文地址:CSS FOR BAR GRAPHS [...]

  • 388

    西米CC – 一花一世界 – CSS实例教程:基本型CSS条状图表 on February 8th, 2010

    [...] 原文地址:CSS FOR BAR GRAPHS [...]

  • 389

    CSS Graphs And Charts: 11 Hand-picked Tutorials And Solutions on February 22nd, 2010

    [...] 8. CSS For Bar Graphs [...]

  • 390

  • 391

  • 392

    TG Developer » 50+ Free Resources for Charts and Graphs Solution on March 13th, 2010

    [...] Official Link [...]

  • 393

  • 394

    Coupons on March 28th, 2010

    Great article. Please add more info!
    Thanks

  • 395

  • 396

    Professional concept about CSS Part-4 | Blogs.iehsan.com Blogs - Welcome to Best World Free Blogs Services on April 8th, 2010

    [...] visual for a group of otherwise boring statistics. Apples to Oranges has found a way to accurately display bar graphs with CSS only. It’s an elegant solution for what would have to otherwise be hardcoded or done with [...]

  • 397

    some CSS bookmarks | HTML 5 stars on April 9th, 2010

    [...] applestooranges.com/blog/post/css-for-bar-graphs [...]

  • 398

    Derrick on April 16th, 2010

    Very nice work!

  • 399

    精选30个优秀的CSS技术和实例 : 冷兵器时代 on April 23rd, 2010

    [...] 24.CSS柱状图:实例 [...]

  • 400

    Forum 53 công nghệ CSS mà bạn không thể thiếu | ..::manlivokma::.. Free download on April 24th, 2010

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 401

    10 Многообещающих, но внушающих уважение техник CSS. | Как создать свой сайт. Все о html, css, jquery, php, wordpress, javascript, ajax on April 25th, 2010

    [...] Apples to Oranges нашли способ аккуратно представлять Bar-диаграммы лишь одним CSS. Это – элегантное решение для вещи, которая иным [...]

  • 402

    53个你离不开的CSS技巧 | narco on May 7th, 2010

    [...] 4. CSS For Bar Graphs [...]

  • 403

    Bartosz Taborowski - Personal Portfolio | Artykuły on May 19th, 2010

    [...] CSS For Bar Graphs – przykładowe wykorzystanie CSS do tworzenia prostych wykresów. [...]

  • 404

    CSS实例教程:基本型CSS条状图表 on May 19th, 2010

    [...] 原文地址:CSS FOR BAR GRAPHS 翻译整理:西米CC css实例效果教程浏览器 [...]

  • 405

    Webdunyam.Net » 42 Adet CSS Hilesi on June 7th, 2010

    [...] mit CSS Listen-Box mit CSS Tizag CSS Tutorial CSS Cursor Bilder Style mit CSS CSS Sandbox CSS Balken-Diagramme Email-Adresse vor Spidern verstecken Float verstehen Wie man seine CSS-Webseite vom Entwurf aus [...]

  • 406

  • 407

    Geek is a Lift-Style. » Tutorials Round-Up: Ajax, CSS, PHP and More on June 11th, 2010

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 408

    Geek is a Lift-Style. »Archive » Charts And Graphs: Modern Solutions on June 11th, 2010

    [...] CSS for Bar GraphsAnother CSS-technique by ApplesToOranges. [...]

  • 409

    Geek is a Lift-Style. »Archive » Diagrams: Tools and Tutorials on June 16th, 2010

    [...] CSS For Bar Graphs describes another approach for presenting graphs with CSS and XHTML. [...]

  • 410

    Yene on August 10th, 2010

    OMG that is I can say for now very nice

  • 411

    精选30个优秀的CSS技术和实例 | 田园牧歌 on August 12th, 2010

    [...] 24.CSS柱状图:实例 [...]

  • 412

    Ngân hàng đồ họa » 53 CSS-Techniques You Couldn’t Live Without on August 14th, 2010

    [...] 4. CSS For Bar Graphs [...]

  • 413

    20 Advanced CSS Techniques and Examples – Designers Need to Know | TechCircles on August 20th, 2010

    [...] 6. CSS For Bar Graphs [...]

  • 414

    Amliorez vos comptences CSS on August 20th, 2010

    [...] CSS For Bar Graphs [...]

  • 415

    thinking in website @ Technology Memo For Computer on August 30th, 2010

    [...] 你想到曾经论坛上标记积分所用的 bar 了没有? 转眼数年过去, 现在已经是 CSS 的世界了. CSS For Bar Graphs [...]

  • 416

    15+ Pure CSS Effects and Tips | Design Dazzling on September 30th, 2010

    [...] CSS Graphs [...]

  • 417

    Umieszczanie wykresów na stronach www - HTML i CSS on October 3rd, 2010

    [...] CSS for bar graphs – prosty generator wykresów słupkowych dwuwymiarowych. Wymagania: JavaScript. Działa pod różnymi przeglądarkami – Firefox 1.0+, MS IE 6+, Safari 1.3+ i Opera 9+. Link do przykładu działania. [...]

  • 418

    40个很不错的CSS技术-传播、沟通、分享-一直“有你” on October 7th, 2010

    [...] 17. CSS Bar Graphs: Examples [...]

  • 419

    Pure CSS Effects and Tips | Designing Mall on October 18th, 2010

    [...] CSS Graphs [...]

  • 420

    Data Visualization with CSS: Graphs, Charts and More Web Burning Blog on October 18th, 2010

    [...] Percentage Bargraph [...]

  • 421

    40个很不错的CSS技术 | AnhuiHost on October 21st, 2010

    [...] 17. CSS Bar Graphs: Examples [...]

  • 422

    Create Charts And Graphs With Nifty Codes & Tools | Free Web Design Tucson on October 25th, 2010

    [...] Complex CSS Bar Graph Love, Education , War Craft are few things to graph. Is it in a good side or bad side? With this complex bar graph , an indicator that uses a marker position to determine your data. The color scheme also help in identifying the data from lighter shade to darker shade. With the help of the <dl>, <dt>, and <dd> tag incorporated into CSS , your ready to mark. [...]

  • 423

  • 424

    精选30个优秀的CSS技术和实例 | 用户体验设计家园|UEDHome on November 3rd, 2010

    [...] 24.CSS柱状图:实例 [...]

  • 425

    CSS For Bar Graphs | andytilia on November 8th, 2010

    [...] CSS For Bar Graphs. [...]

  • 426

    online chart tools « masih dalam tahap pengumpulan link on November 23rd, 2010

    [...] Percentage Bergraph [...]

  • 427

    提升用网页户体验的40个CSS技术 | 鸟人网 on December 9th, 2010

    [...] 17. CSS Bar Graphs: Examples [...]

  • 428

    Ajax, CSS, PHP and More | Mac Dis on January 17th, 2011

    [...] CSS FOR BAR GRAPHS58 Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 429

    53 CSS-Techniques You Couldn’t Live Without By Smashing Magazine | Tech-Guruji on January 27th, 2011

    [...] 4. CSS For Bar Graphs [...]

  • 430

    优秀的CSS技术和实例 | Css114标准化 on January 30th, 2011

    [...] 24.CSS柱状图:实例 [...]

  • 431

  • 432

    alf on March 4th, 2011

    Y donde estan los archivos para descargar????? el download???????????????
    Whatkup?????????????????????????????

  • 433

    Most Useful 50 CSS Tips And Tools For Webmasters | kanser, AIDS, beslenme, gebelik, ilkyardım, cinsel yaşam ve estetik on March 21st, 2011

    [...] CSS Bar Graphs, Make fancy bar graphs for your website styles. [...]

  • 434

    Useful CSS Tips & Resources | iWeb Builders on March 26th, 2011

    [...] CSS For Bar Graphs Share and Enjoy: [...]

  • 435

    优秀的30个CSS技术和实例 | 阿越的博客 on April 11th, 2011

    [...] 24.CSS柱状图:实例 [...]

  • 436

    omarxp on April 28th, 2011

    this is what I was looking for, thanks

  • 437

  • 438

    jitendra sahu on September 9th, 2011

    awesome article for web developer.Teaching lot of

  • 439

    40个很不错的CSS技术 | 花生米 on November 3rd, 2011

    [...] 17. CSS Bar Graphs: Examples [...]

  • 440

    精選30個優秀的CSS技術和實例 « orangeflower1219 on November 7th, 2011

    [...] 24. CSS柱狀圖:實例 [...]

  • 441

  • 442

  • 443

    CooxomoRace on December 17th, 2011

    When it become cold, people have a trend to locate some cloths to resist warm no matter in which you will be. Very goodcozy. And granted the very fact that jackets are light-weight and waterproof, they provide independence ofmountain with the northern hemisphere that is frequently quite possibly the most complicated aspect to climb. The brand names logohad come to occasion? one thing the Brazilians get working experience to flourish! Wonderful to browse a wonderful capability toAs it normally takes quite a bit of body weight, it is important the hip-belt is huge, perfectly padded and easily adjustable. [url=http://www.northfacejacketssaleoutlet.com]north face outlet[/url] will evidently adjust lives of this attributes. The stuff utilized for creating numerous Canada goose elegant puts onwell known image, we are able to simply stimulate how all this recognition came about. In the late 1990s, a stylepeople today want to store at North ExperienceSpyder Fits is actually very prevalent at races in Brazil). With your rain falling steadily, entirely was aplenty of to protected oneself vs wonderful freezing conditions. the north deal with revenue fur prevail over these two

  • 444

    53 tecniche CSS per tutti gli usi on December 28th, 2011

    [...] 4. CSS Bar Graphs (CSS For Bar Graphs) [...]

  • 445

    ViettatsCheft on January 3rd, 2012

    Come to see us contemporary to

    come by more information and facts

    regarding Drop in on us

    contemporary to grasp more

    low-down and facts anyway

  • 446

    36 great Free JavaScript Charts Solutions on January 17th, 2012

    [...] CSS Bar Graphs [...]

  • 447

    26 Very Useful CSS Tips and Tutorials on January 17th, 2012

    [...] CSS For Bar Graphs [...]

  • 448

    necahafpack83 on January 18th, 2012

    Sorry for the huge review, but I’m really loving the new Zune, and hope this, as well as the excellent reviews some other people have written, will help you decide if it’s the right choice for you.

  • 449

  • 450

    Cialis on January 26th, 2012

    Informative article, exactly what I needed.

  • 451

    精选30个优秀的CSS技术和实例 : BLOG on February 20th, 2012

    [...] 24.CSS柱状图:实例 [...]

  • 452

    CSS3 Tutorials and Resources: From the Web, For the Web | CSSJockey.com on February 28th, 2012

    [...] 11. Apples to Oranges – CSS For Bar Graphs [...]

  • 453

    CSS Graphs And Charts: 11 Hand-picked Tutorials And Solutions « CSS Tips on March 12th, 2012

    [...] 8. CSS For Bar Graphs [...]

  • 454

    Stuart on March 18th, 2012

    Started using something similar to this to show the percentage of coupons that work on our site. Great way to visualise so the consumer can make a better decision about which are working etc.

  • 455

    annoneeempict on May 9th, 2012

    If you basic to take into account chanel bags,chanel lolly and chanel,call to the chanel website!You hankering trip on your favorite foot the introduction and send systemization of Dissipation defame on all sides the people,the Richness pocket in the discounted prices and the highest seasonal comprehension in the service of lady!
    [url=http://www.chanelshop2012.com/]シャネル[/url]
    [url=http://www.chanelshop2012.com/]シャネル 財布[/url]
    [url=http://www.chanelshop2012.com/]シャネル 通販[/url]
    シャネル 通販 : http://www.chanelshop2012.com/

  • 456

    rarExarse on May 9th, 2012

    Online ordering within reach! Fashionable Omega Seamaster and Cartier watches from Rolex circumspect outlets with judicious prices, biggest distance and free presentation! Lift 35% Off. We swear to the authenticity of every ingredient we sell.
    [url=http://www.watchesshopjp.com/]オメガ シーマスター[/url]
    [url=http://www.watchesshopjp.com/]カルティエ 時計[/url]
    [url=http://www.watchesshopjp.com/]ロレックス 時計[/url]
    ロレックス 時計 : http://www.watchesshopjp.com/

  • 457

    css相关资源网站 ‹ 第九城市 on May 23rd, 2012

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 458

    CSS For Bar Graphs » Web Design on May 28th, 2012

    [...] CSS For Bar Graphs [...]

  • 459

    CournomoKem on May 28th, 2012

    彼女のハンドバッグのない女性は、砂漠の放浪者として失われた感じ。彼女はそれが大たいと考えています。彼女が今不足して成長して、革でそれを得ることができない場合、彼女は布、毛皮、あるいはプラスチックでそれを取ることになります。ハンドバッグは、彼女の消耗品の可動ベース、彼女の予想されるニーズのデポです。これらの最終的なニーズははるかに想像​​力のいずれかの男の力を超えた程度に手を差し伸べることができます。女性のハンドバッグは、神秘的なダンジョンです。それが彼女の本当の自己への鍵です。多くの詩的な概念に平凡な答え。 [url=http://www.bagscheapjp.com]バッグコーチ[/url] 魔術師は彼のトリックを説明したいことはありません。クローズハンドバッグ約タブーのオーラがあります。すべての女性は、その神聖なプライバシーに誰かの視線であれば不安な表情を持っています。彼の仲間が彼女のバッグを開くたびにまともな男は常に巧みに天井を凝視する必要があります。彼は、もちろん、かなり頻繁にその天井に集中する必要があります。
    お金はあなたが女性のハンドバッグの中で最も頻繁に欠場することです。スリは、女性の驚くべき数はハンドバッグに貴重な所属を運ぶという事実を除いて、それを盗むためながら、今日ではほとんど価値がありません。 [url=http://www.bagscheapjp.com]バッグ通販[/url] 彼らは、クローゼットや引き出しから盗まれることが恐怖のためにそれを行う。我々は数千ドル相当の宝石を含んでいるので、頻繁にタクシーで失われたハンドバッグの読み取り理由です。それは女性が首にジャンクジュエリーを着用し、彼らのハンドバッグのファスナー部門の貴重なジュエリーを運ぶ不思議な時間です​​。
    そしてすべての人が2分のドラマを知っているこれまでに繰り返される “天、私は(または私の20ドル札、私のキーは、その重要な手紙)、私の時計をなくしている必要があります!”これは通常、ハッピーエンドを持っています。何も人より多くの自己満足な経験よりも与えません。男性の優位性の全体の神話は男がハンドバッグを運ぶことはないという事実に基づいて構築されています。 [url=http://www.bagscheapjp.com]バッグコーチ[/url] 男性は彼らの美しいハンドバッグを買うことによって永遠の依存関係の女性を保持します。どのような女性の心は甘美なワニのバッグを見て溶かす、またはソフトスエードやブロケードはないでしょうか。男は数々の快適な深いポケット内のすべてを運びます。それがベストとオーバーコートとスーツを着た男が20のポケットを持っていると推定されています。も不思議では彼が何かを失うことはありません!女性はまた、スーツやコートのポケットを適応している。しかし、ほとんどの純正だけに手を入れてフィットされています。他ののぞき見のうちのにシフォンのハンカチのために十分であるか、またはそれらが偽造されています。ない女性のスーツのポケットには彼女の持ち物を保持することを意図しています。すべての膨らみは、スリムラインとスマートの効果を危険にさらすだろう。したがって、女性はハンドバッグを運ぶために続けています。女性はポケット付きのメンズスーツを着用していない限り、彼らは女性のままになります。男性は優越感を感じるし続けます。アダムはイブ用に購入した最初のものはハンドバッグであった。それはリンゴのための彼の甘い復讐であった。
    本当の誘惑の素晴らしく楽しい気持ちであなたを記入します絶対に魅力的なコンテンツや美しい写真とファッションと歴史の組み合わせ。 [url=http://www.bagscheapjp.com]バッグコーチ[/url] バッグは、彼らが効果的に彼らがで輸送するために必要なすべてを保持することができませんでしたので、人々は彼らと周りに運ぶために貴重な何かを持っていたが、袋が含まれている項目はtime.Peopleにわたって変更された袋を運んで以来、私たちの日常生活に欠かせないされている手。バッグは、彼らが一度に多くのものを運ぶことができました。
    いくつかの心理学者は、女性が彼女のバッグを運ぶ方法が特徴だと思います。 “Bagology”は非常に科学である。ストラップタイプ、ショルダーストラップの種類と彼女の腕の下に彼女のバッグをタック女性があります。 [url=http://www.bagscheapjp.com]バッグ激安[/url] 両方のストラップで自分のバッグを保持し、腕の下に押された女性の多くがあります。心理学者の角度、女性はキャリアの彼女の財布が軽い心と寛大さから慎重にと貪欲に、特性の全体の規模を示す方法から見た。あるアナリストは、彼らのバッグは手首にしっかりとロックの周りに固く握られた手の周りに巻き続ける女性に対する男性の警告が表示されます。

  • 460

    53 Kỹ Thuật CSS– Bạn Không Thể Thiếu « on June 7th, 2012

    [...] 4. CSS For Bar Graphs [...]

  • 461

    Loicisme on June 20th, 2012

    Comprendre les Options Binaires http://lesoptionsbinaires.blogspot

  • 462

    Oliviers on June 23rd, 2012

    Maitriser avec les options binaires a cette endroit http://www.methodeargent.net

    Bourse en ligne, Trade, Trading, Broker, Trader, Option Binaire Methode Argent

  • 463

    Charts And Graphs: Modern Solutions | PSDSir on July 9th, 2012

    [...] CSS for Bar GraphsAnother CSS-technique by ApplesToOranges. [...]

  • 464

    53 CSS-Techniques You Couldn’t Live Without « shivawebhelp on August 9th, 2012

    [...] 4. CSS For Bar Graphs [...]

  • 465

    found via bing on October 7th, 2012

    Great blog here! Also your web site loads up very
    fast! What host are you using? Can I get your affiliate link to your host?
    I wish my website loaded up as fast as yours lol

  • 466

    Tutorials Round-Up: Ajax, CSS, PHP and More | THE SMASHING MAGAZINE on December 15th, 2012

    [...] CSS FOR BAR GRAPHSBasic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 467

    Comment réaliser de beaux graphiques en CSS on January 14th, 2013

    [...] article/sources [...]

  • 468

    this link on January 30th, 2013

    Hello! Do you know if they make any plugins to assist with Search Engine Optimization?
    I’m trying to get my blog to rank for some targeted keywords but I’m not seeing very good gains.
    If you know of any please share. Appreciate it!

  • 469

    penis advantage program on March 3rd, 2013

    Very soon this web site will be famous amid all blogging users,
    due to it’s fastidious articles

  • 470

    Diagrams: Tools and Tutorials - Goodfav Howto on March 3rd, 2013

    [...] CSS For Bar Graphs describes another approach for presenting graphs with CSS and XHTML. [...]

  • 471

    Tutorials Round-Up: Ajax, CSS, PHP and More - Goodfav Howto on March 4th, 2013

    [...] CSS FOR BAR GRAPHS Basic CSS Bar Graph, Complex CSS Bar Graph, Vertical CSS Bar Graph [...]

  • 472

    53 CSS – Techniques You Couldn’t Live Without | vnDezign on March 15th, 2013

    [...] 4. CSS For Bar Graphs [...]

  • 473

    ginger alden photo on March 19th, 2013

    On a cold winter morning, nothing like ginger tea to kick start your day.

    A little ground ginger added to mayonnaise makes a great topping
    for a pear salad. Below, meizitang botanical slimming soft gel will share the secret of it with you.

  • 474

    useful reference on April 13th, 2013

    I was reading some of your content on this website
    and I believe this web site is rattling informative
    ! Keep putting up.

  • 475

    fitness on April 16th, 2013

    Super blue green algae has absorbable powerful nutrients contains entire spectrum
    of eight essential amino acids and ten nonessential amino acids.
    Most likely, other members experience the same health issue especially if it is learned to be contagious.
    Juice Fast is a fasting method and a detox diet where a person
    consumes only fruit and vegetable juices to obtain nutrition while otherwise abstaining from
    food consumption.

  • 476

    budget on April 22nd, 2013

    You time to get on with the Bengals 1 day ago via web
    Reply Retweet Favorite powered by socialditto JordyHamrickJordanHome Depot.
    And what better way to wind-down the work day than with a selection of some
    of the occasion?

  • 477

    rosehip oil on May 15th, 2013

    Underneath all the beauty though is where that flower’s true health benefits lie. Natural rosehip oil can help to treat the dry patches; it can be applied all over your body, including your face. It absorbs quickly and can help reduce the appearance of lines and wrinkles, and is particularly effective in soothing sunburn and reversing damage from the sun.

  • 478

    more on May 25th, 2013

    Merely a smiling visitor here to share the love (:, btw great design and style.
    “Better by far you should forget and smile than that you should remember and be sad.” by Christina Georgina
    Rossetti.

  • 479

    30 Exceptional CSS Techniques and Examples | HTML CSS3 on June 16th, 2013

    [...] 24. CSS Bar Graphs: Examples [...]

  • 480

    free Personal Ads on June 25th, 2013

    Our great community at http://www.livecamsfor.
    us . Hookup with gorgeous young ladies who live in your local area.
    Meet very attractive young girls who want sex and casual dating.
    All types of nationalities of females available. Call’s best 100% FREE online dating site. Meet loads of available single women! Find a girlfriend or lover, or just have fun flirting online. Our community is full of hot girls and men waiting to hear from you!
    Stop paying for online dating sites now. Create your own personal profile with photos, video and audio. Talk with other members in online chat or privately via instant messenger.

  • 481

    53 CSS-Techniques You Couldn’t Live Without | godadiX on July 5th, 2013

    [...] 4. CSS For Bar Graphs [...]

  • 482

    Regarder Iron Man 3,Iron Man 3 En Ligne,Iron Man 3 Online,Voir Iron Man 3,Regarder Les Croods,Regarder Les Gamins,Regarder Spidre Man 3 en Haute Definition,Regarder Plein Soleil Film Complet,Regarder Wolverine : Le combat de l'Immortel Film Complet,Regard on July 6th, 2013

    I am going to right away clutch ones rss because i are not able to to locate your electronic mail monthly subscription weblink or even ezine assistance. Carry out you could have virtually any? Be sure to allow everyone recognize making sure that I possibly could sign up to. Thank you.

  • 483

    Cash advance on July 25th, 2013

    obviously like your web site however you have to check the
    spelling on quite a few of your posts. Several
    of them are rife with spelling problems and I to find it very bothersome to inform
    the reality on the other hand I’ll certainly come again again.

  • 484

    Better css_graph | Still Vegan. Still Straightedge on August 8th, 2013

    [...] written by Geoffrey Grosenbach over at nuby on rails. It’s a rails helper wrapped around some work making graphs out of xhtml and css. done by the folks at Apples to Oranges. It’s pretty [...]

  • 485

  • 486

    40个很不错的CSS技术 | multiprocess on November 10th, 2013

    [...] 17. CSS Bar Graphs: Examples [...]

  • 487

    pas cher air jordan flight 45 on November 28th, 2013

    I抦 not that much of a internet reader to be honest but your blogs really nice, keep it up! I’ll go ahead and bookmark your site to come back later on. Cheers
    pas cher air jordan flight 45

  • 488

    francis on December 10th, 2013

    This is a real engineering solution…a simple solution for such a complex problem!
    Thank you Sir!

  • 489

    Mavis on February 22nd, 2014

    IBM, ATI but also Si – S were made use of as technology married couples for the kind of the Xbox 360 hardware. There will frequently be a tie up with Microsoft and the promo could include free codes. These sites allow users to register for free and total free surveys.

  • 490

    Diagrams: Tools and Tutorials | Smashing Magazine on April 17th, 2014

    [...] CSS For Bar Graphs describes another approach for presenting graphs with CSS and XHTML. [...]

  • 491

    Diagrams: Tools and Tutorials | Smashing Magazine on April 17th, 2014

    [...] CSS For Bar Graphs describes another approach for presenting graphs with CSS and XHTML. [...]

  • 492

    53 CSS-Techniques You Couldn't Live Without | Smashing Magazine on April 17th, 2014

    [...] 4. CSS For Bar Graphs [...]

  • 493

    day trading for beginners on May 5th, 2014

    Good info. Lucky me I discovered your website by
    accident (stumbleupon). I have saved as a favorite for later!

  • 494

    Mark on June 5th, 2014

    I think the admin of this web site is actually working hard in favor of his web site, since here every material is quality based information.

  • 495

    sexe cam on June 17th, 2014

    Ιn the ԝords of Jack Kerouac: “It isn’t what you write, it’s the way you write it.”
    Ԝell, you do it well!I honestly cɑnnot decide іf I want to share your blog with my buddies or keeƿ it as my νery oԝn private secret…

  • 496

    Create Charts And Graphs With Nifty Codes & Tools on June 27th, 2014

    [...] Complex CSS Bar Graph Love, Education , War Craft are few things to graph. Is it in a good side or bad side? With this complex bar graph , an indicator that uses a marker position to determine your data. The color scheme also help in identifying the data from lighter shade to darker shade. With the help of the <dl>, <dt>, and <dd> tag incorporated into CSS , your ready to mark. [...]

  • 497

    Brigette on July 1st, 2014

    Wow that was strange. I just wrote an incredibly long comment but after I clicked submit my comment didn’t appear. Grrrr… well I’m not writing all that over again. Regardless, just wanted to say excellent blog!

  • 498

    Elisa on July 10th, 2014

    Operating costs are a positive thing to be in your personal rating of 800 based on how long each item that impacts your credit score can affect your job. It can make the decision to obtain a loan with a copy in the UK are available. Private debts on time so that his credit score you can explain that I could sign their loan or credit mentality. Through this loan chapter 13 bankruptcy cover student loans scheme. Try to keep good credit stats does not have chapter 13 bankruptcy cover student loans to bring up the inaccuracies.

  • 499

    Eliza on July 13th, 2014

    See how he is about you and how he is about other girls. With these beautiful women close to you, it is quite not possible not to be ultimately pleased. Nevertheless, when you win her coronary heart, she is yours permanently. https://Twitter.com/SumitSEOFlorida


  • 9 Rules Network

    ADD A COMMENT




       (will not be published)




    NOTE: We won't share any of this information with anyone, in fact it won't even be used by us. It's only stored to make commenting easier on you.

    renaissance chemise blouse high thread count sheets not sateen buy frozen oregon berries wedding venues dallas high thumb hold on a 1911 faruza balk f22 steel high tibial osteotomy iriver clix 4gb newspaper perpignan france high tide portsmouth puertas acorazadas 107.7 the bone high tides in north yorkshire pictures of buts edgefield sc high tight circumcision certain beanies worth mooring bouy high tight haircut jenaveve assparade 6 train groping videos high tight recon rechargeable spotlights dickies pinstripe scrubs high torq and hp centrifugal cluch tempura japanese food meade quartz drive corrector high triglicerides chronic lymphocytic thyroiditis trion high school high visibility coveralls evisu jeans colusa casino high volt alternator rkelly lyrics to god specializes high voltage cable tibia ip changer 7.6 storestacker plus high voltage design guide summary coleman knox tn 1804 chemistry for class 8th high voltage electrolytic capacitors kiana tom sucking kate schuman high voltage hibiscus saint brigid work coveralls high voltage jacobs ladder applebees restaurant menu kerberos saga jin roh figure high voltage linesman furry shota unidentified submerged objects high voltage negitive ion generator voir dire in texas criminal cases fucking amal high voltage tattoo public streaking roketa high voltage training gerald zorn crowne plaza implosion high volume filtration of hydraulic oil what are chiggers new orleans lower ninth ward high waist vinyl pants receding gumline aiko tanaka asian hot import model high waist wide leg pants lucy calkins installing banisters high waisted ladies shorts fisher-price rainforest jumperoo split ender high waisted wide leg pants bob segar albums daiquiri cuba high water search city venice floods ars gratia artis mother-in-law suite florida high wheel line trimmer adora dolls 2008 c300 high wheel trimmer sex webtv fid lisation client high wind chimney caps black sistas pelton crane autoclave parts high yield cds dallas suburb de windows xp umts spectrum analyzer high yield dividend trusts liposculpture dallas disposable coveralls high yield rates for cd zeb atlas nude hemingway daiquiri high yield traders switzerland superlotto plus penis images high-tide video food grade diatomaceous earth writing anecdotes highbury nursing home stourbridge ning baizura double bubbler higher by creed lyrics belgian pralines manufactuers of car scratch repair highest grossing movie master tradesman tools sweater stretchers highest grossing movies strict interacial stepmother stories city of nixa missouri highest grossing movies of all time catarina valente jim stilwell highest grossing nc-17 movie new orleans rise song ron's hamburgers highest intelligence smartest history list tulsa burried car battle of britan highest payouts online casino cubana airlines honda v65 magna highest prices to sell jewelry online leadership evolving in nursing ranger aerospace steve townes highgate center vermont 1770 s october 1986 accident dallas co archives approximate rhyme highland cathedral sheet music vacaciones inteligentes haggar pants highland cattle for sale dallas smile makeover philipine highland co ohio countryman families linsley hood class a amplifier 1993 dallas cowboy cheerleaders pictures highland county auditor singer treadle sewing machine decals femail sissify highland county clerk of courts boyd gunstocks mounds view class of 1978 highland county mobile homes minoan women victorian era class system highland county ohio auditor polestar pilates dallas erotic massage highland park baptist church class a toyhauler lyrics battle of new orleans highland park braces kaley cuoco visible penis lines highland park britesmile dog deseases dallas summer musical highland park clear braces prom corsages leather beanbags highland park cosmetic dentistry connemara marble skowhegan savings bank highland park dental implants kolcraft highchair calf hutches highland park dentures sanantonio taxis iaff union by-laws florida highland park extreme makeover directshow 8a scroll saw paterns highland park headaches csl trunk e46 baker drivetrain highland park hotel los angeles penis tatoo hmc green machine highland park il florists wind ventilators penis size contest highland park il white pages ivor biggun wayans brothers highland park illinois real estate treatment earache definition of godspeed highland park implant dentistry hangover finalists lincoln lsc highland park instant orthodontics spyderco karambit soverign center reading pa highland park invisalign camdenton mo motels cat hyperthyroid highland park isd irag hoover windtunnel highland park migraine automotive pinstriping post-op transsexual highland park neuromuscular dentist gutar 18372 tannersville pa contact highland park orthodontics spaghetti marinara fatman fabrication highland park orthodontist burris 30mm signature scope ring noaa bouys highland park rock saws ingot mold telluride blues and brews highland park scotch astin martin coleus care highland park sedation dentist greensboro colliseum pilates in melbourne highland park sleep dentist onassis olympics windjammer tossing and turning download highland park sleep dentistry bmx plus magazine disney crusies highland park teeth whitening metrim plus mentone cabins highland park tmj tarif mutuelle sante strat gie fid lisation client highland park tmj treatment gaiaonline layouts chickasha ok highland park tooth crown objektif modul matematik kef kht 1005 ht review highland park tooth whitening utep miner logo richmond colliseum highland park united methodist church homemade penis enlarger babies and mouth thrush highland san bernardino banker pimples on shaft of penis high class split bamboo fishing rod highland san bernardino broker zachariah walker ohio plus size maid costume highland san bernardino construction emac hard drive replacement aditya narayan highland san bernardino teachers minimally invasive parathyroid surgery funny pacifiers highlander folk school thalidomide babies nellie bly biography highlander folk school photos geoffrey beene suit jackets tlingit art highlander institute anniversary 2007 shotshell csn lighting highlanders football club body contouring surgery texas ksc airgun highlands county clerk of courts mikel meringa shai ebony porn star highlands county jail inmates tehama county brandon mize highlands county property appraiser christian booksellers association ladybug switchplates highlands county tax collector britny spears sex tape sheila scott macintyre highlands hammock state park imgboard cgiworld jp php id brian's song highlands inn carmel california presbyterian hospital of dallas house cleaning shoreview highlands nc homes coddington wheels shoujo images highlands nc homes for sale wilson 7.6 rollers bikers for babies highlands nc land for sale iver johnson arms haunted hospital in ohio highlands nc luxury homes travestis nos amamos pinagmulan ng wika ng pilipinas highlands nc real estate crabmeat recipes wisconsin state taxes highlands ranch homes for sale penis measuring enchanted rock state park highline homes white coveralls metamora illinois highline medical center inversiones inmobiliarias rumania the riches tv show highline school district pruebas de estanqueidad corpus cristi highlines fan club albinism kenan and kel highly rated online degree programs la purisima haunted garden scott storch rap beats for sale highschoolmusical2 lyrics saxophones for sale baily boling eliza day hight school musical dodge caravan sxt houston texas history of the calkins hight school musikal marybeth lorbiecki penis shot large hightide video afro sistas yuasa battery tender hightide video production first class continental airlines tickets dunkeswell aaf hightide videos samuel gridley howe marlon wayans highway 1 stratocaster reviews diminished value automobile appraisals tangram puzzle shapes highway 99 blues club margaret dorfman clenbuterol 40 mcg highwayman lyrics status report management catalog eca cz rami highwaymen art florida dallas ophthalmology long sleeve poplin coveralls highwaymen florida linda biggs poetry shiva puja highwaymen painting for sale yulia nova video brithday ecards highwaymen paintings for sale elmers aquarium iver gertrude cloud higley school district mini pinchers remarriage perpetual sin higley unified school district texas shotshell loader alojamientos en granada hijab sex genoptr ning gian-carlo elia hiker swinger pictures orthodontic retainers penis drawings hiking estes park vicar of dibley ultimate collection viviendas de lujo hiking jacksonville florida houlton me coosa valley credit union hil st soul amiture photos mahou shoujo ai hilarie burton pictures chloroformed damsels videos small hutches and buffets hilarious videos web webcrawler olympus 256 mb smartmedia memory card camisas hilary clinton black panthers vance international security rapid responce team icehouse street cafe hilda doolittle sheltered garden review hopatcong nj punky color hilder v st peter plastic leaching yellow rose wedding boquet hiles family history gadsden riverfest ex-wife warren jeff hiline home nylon rainwear movies mimi's restaurant hiline homes biography of selena quintanilla perez titanic sank hill hospital of sumter county home remedies for earaches gaff hook hillarious pictures a-frame house truss plans new orleans superdome hillary cackle download audio karrine stephens vacheron constantin patrimony watches hillary clinton black panthers roxboro north carolina custom pinstriping hillary clinton cry video demographics tuolumne county california liz curtis higgs hillary duff pictures mab d and browning 1910 spyderco ceramic stone grits hillary duff pictures in magazine covers southbank tafe center tavistock hillary scott lyrics bullfighting videos ismael ax hillbilly deluxe lyrics mughal dynasty redland cemetary hillbilly golf game tinsel town theater change control emacs hillbilly pictures perfect penis size kabouters en tuin moonart hillbilly sex women's plus underwire shaper sanantonio things to do hillcrest baptist medical center east enders athens news courier hillcrest bedding hotel collection raffi's songs giovanna borghese hillcrest elementary school croup penis enlargement research hillcrest golf club laura huckabee woodworker's supply hillcrest hospital ohio serengeti sopa lodge hypnotherapist in mumbai hillendale country club hurricane catagories puberty penis hiller helicopter for sale posizionamento sui motori toscana acgs hilley electric beach clenbuterol cycle evel knievel dead hilliard city schools p30 chassis navy officer's training hilliard darby high school virtualdub plugins tim bolen hilliard davidson high school how to play pinochle clas ohlson hilliard florida texas cookin kodak easyshare c300 hilliard ohio homes for rent clait plus courseware rosalyn carter hilliard school district orgies pics apartments for rent athens ga hillman cancer center body contouring fl gunstock refinishing hills park summerlin hotels in dallas tx personal injury attorney dallas hillsboro air show plus size halter dress what is aconnecticut person clled hillsboro ohio newspaper chloe sevigny blowjob diabetes insipidus treatment hillsboro oregon school district olay definity mausoleums hillsboro school district valspar paints ssm health care hillsboro school district oregon hoosier haunts cgiworld board hillsborogh county public school lunch menu plaid brooches itty bitty bikini hillsborough county animal control cheerleading megaphones primitives by kathy hillsborough county appraisal nusery rhymes spoofs alojamientos en andorra hillsborough county appraiser used johndeere tractors fireman's fund insurance hillsborough county arrest home decore stores murray's discount auto parts hillsborough county arrest inquiry swim wear cover-up plus size vivienda de alquiler en granada hillsborough county arrest records yuasa battery dallas tooth whitening hillsborough county arrests jessika hallett left handed archtop guitars in australia hillsborough county bar association uninterruptible power supply maintenance slovenski msn plus hillsborough county clerk dallas botox cam damsels hillsborough county clerk of circuit court letterpress thank you cards jeet kune do techniques hillsborough county clerk of court shipps rv riverwalk new orleans hillsborough county clerk of courts body contouring arlington church's fried chicken hillsborough county clerk of the court tina diddle kingdom hearts 358 2 days hillsborough county clerks office colorado schools for children with pdd soprano's hillsborough county courthouse finn mccools carpet rug and room deodorizer hillsborough county dmv neolithic period and period paleolithic john deere snowblowers hillsborough county employment troybilt parts rowena morrill artwork hillsborough county fl property appraiser croscill orleans bedding bede tongs hillsborough county fl public records latitudes and longitudes horoscopos de durango hillsborough county florida clerk of court senior class mottos potbelly sandwiches hillsborough county florida property appraiser billy ray cyrus achy breaky heart alena baeva hillsborough county florida public records holy chords mcclurkin handwashing or infection control scotland hillsborough county florida schools likert scale self cutting preparation of colloids hillsborough county florida sheriff oxon oxfordshire ladies circle alojamiento barcelona hillsborough county forida sheriffs department virginia body contouring haunted brewery georgia hillsborough county jail atlantic superstores pilates studio reviews issaquah bellevue hillsborough county jail records gse solar alon ziv hillsborough county parks kuma tubes magic dtw parking hillsborough county property appraisal vulvar varicose vein