Hi everyone,
I'm going to post the code before explaining my problem(s); I'm thinking it'll be easier to understand if you have the code already running.

Code:

Car myCar1;
Car myCar2;

void setup(){
  size(400,200);
  
  myCar1= new Car(color(255,0,0),100,0,2);
  myCar2= new Car(color(0,0,255),10,0,1);
}

void draw(){
  background(112,138,144);
  
  for(int i=-50;i<width;i+=50){
    for(int j=-50; j<=height; j+=50){
      stroke(25,25,112);
      strokeWeight(3);
      fill(112,138,144);
      triangle(i,j,i+100,j-100,i+200,j);
    }
  }
  strokeWeight(7);
  line(0,height/4,width,height/4);
  line(0,height*3/4,width,height*3/4);
  
  myCar1.move();
  myCar1.display();
  myCar2.move();
  myCar2.display();
}

class Car{
  color c;
  float x;
  float y;
  float speed;
  
  Car(color tempC, float tempX, float tempY, float tempSpeed){
    c=tempC;
    x=tempX;
    y=tempY;
    speed=tempSpeed;
  }
  
  void display(){
    noStroke();
    fill(c);
    rectMode(CENTER);
    rect(x,y,20,40);
    //Wheels
    strokeWeight(2);
    stroke(0);
    fill(0);
    rect(x-10,y-10,5,10);
    rect(x+10,y-10,5,10);
    rect(x-10,y+10,5,10);
    rect(x+10,y+10,5,10);
  }
  
  void move(){
    y=y+speed;
    if(y>height){
      y=0;
    }
  }
} 

Now, for some reason, the 'wheels' on the red car--myCar1--look slanted. The code for the black rectangles--wheels--seems fine to me; what am I missing?
(It's hard to tell, but I think the blue car's wheels are correct.)

My second issue: I'd like to have a total of 10 cars, roughly, on-screen. I'm fairly certain the easiest method is through arrays, but I'm not sure where everything would go (i.e. what parts go in void setup, void draw, or void [insert_function_name_here], and why). I'm not too familiar with arrays, so something simple (or easy to read/understand) would be appreciated.

Thanks for your time.

Code:

Car[] cars= new Car[10];

void setup(){
  size(400,200);

  for(int i=0; i<cars.length; i++){
    cars[i]=new Car(color(i*2,i*9,i*3),i*2,0,i/2.0);
  }
}

void draw(){
  background(112,138,144);

  for(int i=-50;i<width;i+=50){
    for(int j=-50; j<=height; j+=50){
      stroke(25,25,112);
      strokeWeight(3);
      fill(112,138,144);
      triangle(i,j,i+100,j-100,i+200,j);
    }
  }
  strokeWeight(7);
  line(0,height/4,width,height/4);
  line(0,height*3/4,width,height*3/4);

  for(int i=0; i<cars.length; i++){
    cars[i].move();
    cars[i].display();
  }
}

class Car{
  color c;
  float x;
  float y;
  float speed;

  Car(color tempC, float tempX, float tempY, float tempSpeed){
    c=tempC;
    x=tempX;
    y=tempY;
    speed=tempSpeed;
  }

  void display(){
    noStroke();
    fill(c);
    rectMode(CENTER);
    rect(x,y,20,40);
    //Wheels
    strokeWeight(2);
    stroke(0);
    fill(0);
    rect(x-10,y-10,5,10);
    rect(x+10,y-10,5,10);
    rect(x-10,y+10,5,10);
    rect(x+10,y+10,5,10);
  }

  void move(){
    y=y+speed;
    if(y>height){
      y=0;
    }
  }
}
 

Here's a 10-car array, based on Learning Processing's Example 9-9. How can I get the cars to space out evenly, more or less, across the width of the sketch?