Tribute Page Ada Lovelace

Code Feedback
1

I’ve finished the first project: my Tribute Page for Ada Lovelace.

Would love to hear feedback! :slight_smile:

What I learned:

  • there are sometimes multiple ways to program certain features. For the sake of practice, I mixed them a bit on my page. I am thinking that the most elegant way is: Bootstrap > CSS > Inline
  • where to find documentation for HTML, CSS and Bootstrap
  • trying out all those options in Bootstrap sometimes gives unexpected and cool effects :smile: - - there are different editors. Most notably Google Chrome dev tools, Notepad++ and CodePen. I tried all of them
  • it’s really hard to start an empty page in the Google Chrome dev tools. I could not find any decent ‘tutorial for dummies’. I had to ask a friend who’s a programmer, and he showed me
  • it was frustratingly hard to center a well on a page. While searching, I found many different solutions, some of which were ridiculously complicated. Eventually, all it took was auto margin. Duh…
  • at one point you need to say: “It’s finished”. There’s a next project which is more complicated and where I can continue my exploration into HMTL, CSS and JQuery.
2

I would just ad a media query for mobile devices that will change the width for wells from 50% to something higher like 80%. When you see that page on mobile (lets say 400px wide) you will have your wells only 200px wide with a margin left and right of 100px each that is too much in my opinion.

1 Like
3

You can add something like:

@media only screen and (max-width: 600px) {
    .well {
        width: 90%;
    }
}
4

Haha, thanks. I was just in the process of looking it up :slight_smile: I hadn’t gotten to that section yet.

5

And if I remember right, the challenge, also ask you to provide an external link to where the user can read more on the subject.

6

I have a link to the Wiki Ada Lovelace page, on her name, in the first block. I missed the fact that it had to be a link at the bottom of the page.