Challenge #2: Update three cards to launch a modal window when the "Go Somewhere" button is clicked

Requirements

  1. Make a copy of a successful attempt of challenge 1 or create a new file for this purpose that shows several cards on the page.
  2. For the first three cards that include the "Go Somewhere" button, attach a modal launch to that button, so that when the button is clicked, a modal window launches.
  3. Use only Bootstrap defaults to achieve your goals.
  4. Document your process as you go using the structure illustrated on this page.
  5. Document your process as you go using the structure illustrated on this page.
  6. When you break something, try to fix it. If it is broken beyond repair, save the file as a fail and move on to a fresh attempt.

The attempt

...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
...
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere

Process

  1. To start off challenge 2, I searched the Bootstrap website for a way to do a modal launch on a button. I found a Live Demo code and I copy/pasted it to my code.
    • FAIL: I pasted it into my code, but it just sat at the top of my web page. It was not connected with my button.
  2. Because the copy/paste did not work, I decided to try and put the modal code on a seperate page and have the href in the card code to link to the modal page.
  3. After these previous fails, I got to a success! Instead of just copy pasting the code onto the top of my sandpox2.php file, I pasted the Bootstrap code after the original link for a button in the card code. Doing so, added the button from the Bootstrap code while also having a functional modal window. Success!!! I just repeated this code for the first three cards.

Every page's content should end with a call to action that tells the user what to do next. A good call to action will have a link the user can click to go to the next resource we want them to see.