I volunteer as tribute!

I volunteer as tribute!
0

#1

^ This is my first attempt at this website project. I struggled with this for a while and didn’t end up using any jquery or javascript. Would you kindly take a look and offer any feedback? I’d love to improve the site and/or clean up the code.

Thanks!
Beth


#2

Hi bsingley,

CSS inspector:

  • Unexpected empty block
 #timeline{
  
}

HTML inspector:

  • en.wikipedia.org’ is not a valid attribute of the <a> element.

  • ‘sybil_ludington’ is not a valid attribute of the <a> element.

  • ‘wiki’ is not a valid attribute of the <a> element.

<h3> Click <a ref:https://en.wikipedia.org/wiki/Sybil_Ludington>here</a> to learn more about Sybil Ludington
</h3>

MDN documentation:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a

The HTML <a> element (or anchor element) creates a hyperlink to other web pages, files, locations within the same page, email addresses, or any other URL.

Attributes

href
Contains a URL or a URL fragment that the hyperlink points to.

Example

<!-- anchor linking to external file -->
<a href="https://www.mozilla.com/">
External Link
</a>

Cheers and happy coding :slight_smile:


#3

Thanks!

I made the minor fixes you suggested and the link out to the wiki page works now. Next time I’ll do a better QA check on that part. Would you mind sharing the inspector tool you used to find these errors so quickly and neatly?

Also, I’m curious if you (or anyone) has advice on how to achieve the model’s page’s method for causing the header title text to scale as the page is resized. I couldn’t figure out how that worked.

Thanks in advance!

Beth


#4

Hi @bsingley,

  • I used codepen’s html inspector[1]:

wikipedia article

Markup validation is an important step towards ensuring the technical quality of web pages. However, it is not a complete measure of web standards conformance.

Mark-up validators cannot see the “big picture” on a web page,[5][6] but they excel at picking up missed closing tags and other technicalities.


<div class="jumbotron">
    <div class="row">
      <div class="col-xs-12">
        <h1 class="text-center">Dr. Norman Borlaug</h1>

According to chrome DevTools, the class ‘jumbotron’ from bootstrap is applying a media query ( to h1)

https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries

Cheers and happy coding :slight_smile:

[1] HTML inspector : “is a different thing than validating HTML. For instance it doesn’t catch unclosed tags and such” https://blog.codepen.io/2013/11/11/analyze-html-css-js/