#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2005
    Posts
    3
    Rep Power
    0

    Unhappy Help with css and text (bar graphs)


    I have this bit of code which generates a horizontal graph. It uses an image for a background and sets the width to a percentage based on a variable I use

    Here is the php code

    PHP Code:
    echo "<div style='width:500px;'>";
    foreach(
    $choicearray as $key => $val1) {
       
    $pp "{$percentagearray[$key]}%";

       echo 
    "<div class='graph' style='width: $pp;'></div>";
    }
    echo 
    "</div>"
    with the following css

    .graph {
    position: relative;
    display: block;
    height: 10px;
    margin: 0 0 5px;
    background-image: url("images/bluebar.gif");
    }


    It generates the image at the link

    Well, I cant attach an image or a url. Thats kind of bogus Maybe you can make it out form this

    zeissimages dot com /gallery/4/U4I1361854982.SEQ.0.jpg

    My problem is that I am trying to add text before each graph line and whenever I do, the text is overlapped by the image r on a new line. I just want it to look something like this

    text for graph 1 ----------------------------------------
    text for graph 2 -------------------------
    text for graph 3 ---------


    can you help please ?
  2. #2
  3. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Location
    The Pleiades
    Posts
    299
    Rep Power
    8
    Float each piece of text left. That's all I can think of. If using a <p> tag for the text, declare a standard width for the <p>'s.

    Regards,

    NM.

IMN logo majestic logo threadwatch logo seochat tools logo