I've got an HTML issue that says "Element label not allowed as child of element div in this context. (Suppressing further errors from this subtree.)". Any ideas on how to fix this? Thanks a lot.
namlh
@namlh023All comments
- @namlh023Submitted almost 3 years ago
- @AscecentSubmitted almost 3 years ago
Another challenge complete, i've built it without using js for displaying the faq description, it was fun to do, any feedback would be awesome :D
@namlh023Posted almost 3 years agoPretty nice Ivan, I've never seen somebody do this before :).
Marked as helpful0 - @simplyJCSubmitted almost 3 years ago
This is my attempt in creating the profile card. I am having a hard time in setting position for multiple images in background. It may not perfect but I did my best and there is still a lot to learn. Any suggestions or comments are welcome.
@namlh023Posted almost 3 years agoHi Jaycee,
With background-position property, it's easier to set it by keyword value: top, center, right, left and bottom. In this case, you could try something like this:
'background-position: bottom -600px right -700px,top -600px left -700px;
Hope it helps.
Marked as helpful2 - @jsmeyringSubmitted almost 3 years ago
In my tests with Google Chrome and MS Edge, it's everything ok. But with Mozilla and Android, I had some problems to overlay the soft-violet color over the image. It was a little bigger than the image. Could someone help me with this issue?
@namlh023Posted almost 3 years agoDon't worry. The image looks fine on my Android phone Jociel!
Marked as helpful0 - @TerrenceArceoSubmitted almost 3 years ago
I don't really have a lot of question other than how can I give that avatar a white border? Other than that, Please feel free to give me criticism! thank you!
@namlh023Posted almost 3 years agoHi TerrenceArceo,
- Just add
border: 1px solid #fff; border-radius: 50%;
to your.creator img
and you good to go. - And remember styles active mode for your card :)
Marked as helpful0 - Just add
- @zshawdevSubmitted almost 3 years ago
Hi! I'd be grateful to know if my code is as clean and elegant as it could be, and if there's a better way to accomplish things than what I came up with.
The only real issue I was conscious of that I wasn't able to fix is that the background-image simply would not show up on my broswer. I even downloaded someone else's attempt of this challenge, whose preview had the background showing - and despite being present in their code as well - the background-image would not display when I ran, viewed, Chrome Dev Tools inspected etc. the .html myself. Why's that happening? I'm on the latest version of Chrome.
Any comments, insights, suggestions, and advice is appreciated. Thank you!
@namlh023Posted almost 3 years agoHello ZSHAW5555,
You did pretty nice work but here are some ideas you should consider:
- You don't have to download all the front into your project. In this case just import to your CSS file like this:
@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@500;700;900&display=swap');
- Change
<h2>Order Summary</h2>
to<h1>Order Summary</h1>
because of the accessability issues - The "Removes HTML Default Styling" section should get into a separate file.
- .subcription have duplicate
display: flex
. Please remove one. - You should add
cursor: pointer
on hover. - And check .pay-btn padding :)
Marked as helpful0 - You don't have to download all the front into your project. In this case just import to your CSS file like this:
- @Kevo760Submitted almost 3 years ago
Hello Fellow Coders! Coming back from one month of being off on coding due to life events. But I am back at it again. Had to do CSS and HTML first to get the groove back and luckily I still remember most of the knowledge I picked up. Please let me know what I can do to improve on my work. Any feedback is appreciated and helps me develop.
@namlh023Posted almost 3 years agoHello Kevin.
You did a pretty good job but there is something I want to point out:
- You don't have to set fix height for your .card.
- You should have a <main> tag and a <h1> tag in your HTML file (As in accessibility issues). I recommended you change <div class='card'> to <main class='card'> and <h3>Equilibrium #3429</h3> to <h1>Equilibrium #3429</h1>.
- The avatar image should have border-radius: 50%.
- You could set the <a href='#'> instead of google.com (That pretty annoying when click in).
Marked as helpful1 - @Madhu-USubmitted almost 3 years ago
Hi, I am new to front - end development. I'm trying to practice what I learn in my course through these challenges. I would appreciate any kind of feedback.
@namlh023Posted almost 3 years agoHi MashX, welcome to FrontendMentor.
You did a pretty good job but there is something I want to point out:
- You should have a <main> tag and a <h1> tag in your HTML file (As in accessibility issues). I recommended you change <div class='container'> to <main class='cointainer'> and <h2>Equilibrium #3429</h2> to <h1>Equilibrium #3429</h1>.
- The overlay class doesn't need to be that complicated. Check out the solution by Juliana using pseudo-element.
Marked as helpful0 - @juliizqSubmitted almost 3 years ago
Hello! It is my first project, I know that I have to improve many things so I will be happy if you advise me so I can learn more and progress :)
@namlh023Posted almost 3 years agoI saw your live site does not quite like the design. You should check that again! (I had some problems when setting up my Github-Pages too).
You did a pretty job with the image hover. I didn't think about using pseudo-element :)). But I didn't understand why you used h2, h3, and h4. That would have been <p> for me.
Marked as helpful0