drawing multiple rectangles with Cairo graphics

I'm trying to write a Cairo program to black-fill the ent开发者_高级运维ire image and then draw another rectangle inside of it a different color. Eventually, I'm going to make this a program that generates a .png of the current time that looks like a digital clock. For now, this is where I'm getting hung up.

Here's my code:

#include <stdio.h>
#include <cairo.h>

//on color: 0.6, 1.0, 0
//off color: 0.2, 0.4, 0

int prop_number_width;
int prop_number_height;

int prop_width;
int prop_height;
int prop_space_width;
int prop_space_height;

double width;
double height;

double w_unit;
double h_unit;

void draw_number(cairo_t* cr, int unit_width, int num);

int main(int argc, char** argv) {
    /* proportional sizes:
     * the widths and heights of the diagram
     */
    prop_number_width = 5; //how many spaces the number takes up
    prop_number_height = 6;

    prop_space_width = 1; //extra width on each side
    prop_space_height = 1; //extra height on each side
    prop_width = 25 + (2 * prop_space_width); //width of diagram
    prop_height = 6 + (2 * prop_space_height); //height of diagram

    /* actual sizes:
     * the pixel value of different sizes
     */
    width = 200.0;
    height = 100.0;

    w_unit = width / prop_width;
    h_unit = height / prop_height;

    //begin cairo stuff
    cairo_surface_t* surface = cairo_image_surface_create(CAIRO_FORMAT_ARGB32, (int)width, (int)height);
    cairo_t* cr = cairo_create(surface);

    //black fill
    cairo_set_source_rgb(cr, 0.0, 0.0, 0.0);
    cairo_rectangle(cr, 0.0, 0.0, width, height); //cr ref, x, y, width, height
    cairo_fill_preserve(cr);

    //draw numbers from left to right
    draw_number(cr, 0, 1);
    //draw_number(cr, 6, 3);
    //draw_number(cr, 14, 3);
    //draw_number(cr, 20, 7);

    //draw in colons

    cairo_destroy(cr);
    cairo_surface_write_to_png(surface, "test.png");
    cairo_surface_destroy(surface);
    return 0;
}

void draw_number(cairo_t* cr, int unit_width, int num) {
    //determine the box size that the number will be drawn in
    double box_x = w_unit * (prop_space_width + unit_width);
    double box_y = h_unit * prop_space_height;
    double box_width = w_unit * prop_number_width;
    double box_height = h_unit * prop_number_height;

    printf("{box_x: %lf box_y: %lf} {box_width: %lf box_height: %lf}\n", box_x, box_y, box_width, box_height);
    cairo_set_source_rgb(cr, 0.2, 0.4, 0);
    cairo_rectangle(cr, box_x, box_y, box_width, box_height);
    cairo_fill_preserve(cr);
}

The problem is with this code it draws the rectangle to take up the whole image where from the printf's it should only take up a small part. Does anybody know how I can make this rectangle show up as the correct size?

I should have looked at the API more carefully. I needed to do cairo_fill() instead of cairo_fill_preserve(). Apparently, the first call to cairo_fill_preserve() was keeping the original rectangle and always filling that one.