Tribute Page - Build a Tribute Page

Tell us what’s happening:

I can’t get the final 3 steps to clear for some reason. I have #img along with the required display, width, margin, etc but I keep getting the error that all of that is still needed. I’ve been trying to figure this out for over an hour with no idea why it won’t accept my code. I’ve even looked through several other people’s codes that have passed the challenge and they’re all the same as far as how that part has to be typed out. Please help me figure this out.

Your code so far

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

 <head>
        <title>
            Dita Von Teese
        </title>
        <link rel="stylesheet" href="style.css">
    </head>
    <main id="main">
        <div id="main">
            <h1 id="title"> Dita Von Teese </h1>
            <h2 id="subtitle"> The Queen of Burlesque</h2>
            <div id="img-div">
                <img src="https://images.squarespace-cdn.com/content/v1/5c55184293a6324e1f793b37/1661621614094-26T2ZNFVXUNWVUW1L074/DITA-VON-TEESE-LOW-RES-COVER-1.jpg?format=2500w" id="image">
                <figcaption id="img-caption">Dita Von Teese by Mike Ruiz</p>
            </figcaption>
            <div id="content">
                <div id="tribute-info"><p>1972: Born in Michigan with the name Heather Renee Sweet of English, Scottish, Armenian, and German heritage.</p>
                                    <p> 1992: Began performing burlesque and, as a proponent of Neo-Burlesque, has helped to popularize its revival.</p>
                                    <p> 1995: Visited a strip club for the first time at age 19 and was soon hired. She was stunned by the other strippers' lack of originality and wanted to incorporate vintage and fetish style to her performance.</p>
                                    <p> 1996: Adopting the name Dita as a tribute to silent film actress Dita Parlo.</p>
                                    <p> 2002: For her breakthrough December 2002 Playboy cover, she was required to have a surname, so she chose Von Treese from the phonebook. Playboy misspelled it Von Teese, a name which she then kept.</p>
                                    <p> 2002-2007: Appeared on numerous fetish magazine covers, including Bizarre and Marquis. It was around this time when she appeared on the cover of Midori's book, The Seductive Art of Japanese Bondage.</p>
                                    <p> 2005:  Attended a benefit for the New York Academy of Art wearing nothing but $5 million worth of diamonds.</p>
                                    <p> 2006-2007: First book released, which consisted of her opinions on the history of burlesque and fetish, Burlesque and the Art of the Teese.</p>
                                    <p>2009: Ambassador/spokesmodel for HIV/AIDS awareness when she was selected for MAC Cosmetics' Viva Glam VI campaign (a collection of lipsticks and lipgloss where 100% of the proceeds are for worldwide AIDS charities and to raise awareness for HIV/AIDS).</p>
                                    <p>2012: Launched her makeup collection "Classics" in partnership with the German cosmetic brand Art Deco. Also a clothing brand and line of lingerie called Von Follies.</p>
                                    <p>2001-2007: Dated alt-rocker Marilyn Manson. Married in '05 but divorced by '07 due to Manson being un-able to stay faithful.</p>
                                    <p>2015: Releases 2nd book, Your Beauty Mark: The Ultimate Guide to Eccentric Beauty.</p>
                                    <p>2021: Releases her 3rd book, Fashioning The Femme Totale.</p> 
                                    <p>2021: Released the "Burlesque by Dita" video slot, the game has reached multiple iGaming markets worldwide, accounting for hundreds of online casinos where the game is playable in demo or real money mode.</p>
                                    <p>In her own words, she "puts the tease back into striptease" with long, elaborate dance shows with props and characters, often inspired by 1930s and 1940s musicals and films. Some of her more famous dances have involved a carousel horse, a giant powder compact, a filigree heart and a clawfoot bathtub with a working shower head. Her feather fan dance, inspired by burlesque dancer Sally Rand, featured the world's largest feather fans, now on display in Hollywood's Museum of Sex.</p>
           
            <div id="footer">
                <p>To delve deeper into the Queen of Burlesque you can <a href="https://www.photobookmagazine.com/features/dita-von-teese" target="_blank" id="tribute-link">click here</a>.</p>
            </div>
        </div>
    </main>
</html>
 

body {
    background: lightgrey;
}
img{
  display: block; 
   margin: 0 auto;
   max-width:100%;
   height:auto;
}

#title {
    text-align: center;
    text-transform: uppercase;
}

#subtitle {
    text-align:center;
    font-style: italic;
}

#img-caption {
    font-style:italic;
    margin-top: 0;
    text-align: center;

}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/109.0.0.0 Safari/537.36

Challenge: Tribute Page - Build a Tribute Page

Link to the challenge:

Post failed test case here

Here a tip!

The img element and #image id are different things. You need to style the #image id in the css, not just the img element.

I’ve tried this and still doesn’t pass.

1 Like

Please post your full code instead of a screenshot. I can’t test a screenshot in the code editor to see what is going wrong.

Here is the CSS

body {
background: lightgrey;
}
#image{
margin: auto;
max-width:100%;
}

img{display: block;}

#title {
text-align: center;
text-transform: uppercase;
}

#subtitle {
text-align:center;
font-style: italic;
}

#img-caption {
font-style:italic;
margin-top: 0;
text-align: center;

}

So I missed this myself and it explains most of the issues you are having.

<link rel="stylesheet" href="style.css">

The href for the css is wrong which is preventing it from being applied. You have missed one letter off the end. Check what the css tab is called.

Your #image also needs a height of auto.

When I change those things your code passes. :slight_smile:

I haven’t left off anything from my link for the CSS file.

Adding the height to my #image didn’t change anything. Still getting the same 3 errors.

<html>
    <head>
        <title>
            Dita Von Teese
        </title>
        <link rel="stylesheet" href="style.css">
    </head>
    <main id="main">
        <div id="main">
            <h1 id="title"> Dita Von Teese </h1>
            <h2 id="subtitle"> The Queen of Burlesque</h2>
            <div id="img-div">
                <img src="https://images.squarespace-cdn.com/content/v1/5c55184293a6324e1f793b37/1661621614094-26T2ZNFVXUNWVUW1L074/DITA-VON-TEESE-LOW-RES-COVER-1.jpg?format=2500w" id="image">
                <figcaption id="img-caption">Dita Von Teese by Mike Ruiz</p>
            </figcaption>
            <div id="content">
                <div id="tribute-info"><p>1972: Born in Michigan with the name Heather Renee Sweet of English, Scottish, Armenian, and German heritage.</p>
                                    <p> 1992: Began performing burlesque and, as a proponent of Neo-Burlesque, has helped to popularize its revival.</p>
                                    <p> 1995: Visited a strip club for the first time at age 19 and was soon hired. She was stunned by the other strippers' lack of originality and wanted to incorporate vintage and fetish style to her performance.</p>
                                    <p> 1996: Adopting the name Dita as a tribute to silent film actress Dita Parlo.</p>
                                    <p> 2002: For her breakthrough December 2002 Playboy cover, she was required to have a surname, so she chose Von Treese from the phonebook. Playboy misspelled it Von Teese, a name which she then kept.</p>
                                    <p> 2002-2007: Appeared on numerous fetish magazine covers, including Bizarre and Marquis. It was around this time when she appeared on the cover of Midori's book, The Seductive Art of Japanese Bondage.</p>
                                    <p> 2005:  Attended a benefit for the New York Academy of Art wearing nothing but $5 million worth of diamonds.</p>
                                    <p> 2006-2007: First book released, which consisted of her opinions on the history of burlesque and fetish, Burlesque and the Art of the Teese.</p>
                                    <p>2009: Ambassador/spokesmodel for HIV/AIDS awareness when she was selected for MAC Cosmetics' Viva Glam VI campaign (a collection of lipsticks and lipgloss where 100% of the proceeds are for worldwide AIDS charities and to raise awareness for HIV/AIDS).</p>
                                    <p>2012: Launched her makeup collection "Classics" in partnership with the German cosmetic brand Art Deco. Also a clothing brand and line of lingerie called Von Follies.</p>
                                    <p>2001-2007: Dated alt-rocker Marilyn Manson. Married in '05 but divorced by '07 due to Manson being un-able to stay faithful.</p>
                                    <p>2015: Releases 2nd book, Your Beauty Mark: The Ultimate Guide to Eccentric Beauty.</p>
                                    <p>2021: Releases her 3rd book, Fashioning The Femme Totale.</p> 
                                    <p>2021: Released the "Burlesque by Dita" video slot, the game has reached multiple iGaming markets worldwide, accounting for hundreds of online casinos where the game is playable in demo or real money mode.</p>
                                    <p>In her own words, she "puts the tease back into striptease" with long, elaborate dance shows with props and characters, often inspired by 1930s and 1940s musicals and films. Some of her more famous dances have involved a carousel horse, a giant powder compact, a filigree heart and a clawfoot bathtub with a working shower head. Her feather fan dance, inspired by burlesque dancer Sally Rand, featured the world's largest feather fans, now on display in Hollywood's Museum of Sex.</p>
           
            <div id="footer">
                <p>To delve deeper into the Queen of Burlesque you can <a href="https://www.photobookmagazine.com/features/dita-von-teese" target="_blank" id="tribute-link">click here</a>.</p>
            </div>
        </div>
    </main>
</html>
body {
    background: lightgrey;
}
#image{
    height: auto;
  margin: auto;
  max-width:100%;
}

img{display: block;}

#title {
    text-align: center;
    text-transform: uppercase;
}

#subtitle {
    text-align:center;
    font-style: italic;
}

#img-caption {
    font-style:italic;
    margin-top: 0;
    text-align: center;

}

Well, I wasn’t expecting the page to show when I copy/pasted my code :melting_face:
Anyways, the link is correct so that’s not the issue nor is it flagged as an error, it’s only the error for the #image and img properties in the CSS file. I’ve typed them out in several differing ways that have been suggested but nothing fixes the error. Beyond frustrating.

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

The link’s href should be styles.css and not style.css.

1 Like

Damn. I’m obviously blind lol. Thank you, it passed once I added that “s”. Curious why it continued to say I had those 3 errors for the #image and img properties yet it passed once I fixed the missing “s” :thinking:

1 Like

When you wrote this

Your HTML document was looking for a file called style.css but that file doesn’t exist.

When you used the correct filename of styles.css then it worked and passed the test.

Hope that helps!

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.