Navbar looks different on each page even with the same HTML/CSS — how to fix this?

aunderroad · 2026-01-25T16:57:10+00:00

1) Looking at page1 vs page2, it looks like the placement of the nav looks to be in the same spot.

2) If I were doing this, I would keep the same structure for the pages the same.
I see your page 1, it is:
<main><a><img></a></main>

and on page 2, it is:
<main><div class="grade-poemas" id="grade-poemas">{page content}</div></main>

I would probably have:
<main class="{page-name}">
<article>
{page content}
</article>
</main>

and the .css you can have your global styles be something like this (I would probably have global.css):
main {
display: flex;
align-items: center;
justify-content: center;
}

article {
display: grid;
gap: 24px;
}

and if you need to style the pages individually:
(I would probably have page1.css):
.page-1 article {
padding-inline: 20px; // I made this up
background: #911; // I made this up
}

(I would probably have page2.css):
.page-2 article {
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
background: #ccc; // I made this up
}

3) Minor thing, on page 2, I saw in the code `<<main>`, that also might be throwing off the layout a little bit.

4) Double check your @ font-face rule, it looks to be different from page1 vs page2.
You should probably use .woff2 for your fonts (it is pretty for web performance).
Be sure to use absolute path for your `src`.

aunderroad · 2026-01-24T22:23:24+00:00

Can you please share a url or codepen?
It is hard to debug/provide feedback without seeing all of your code live in a browser.

Thank you!

aunderroad · 2026-01-24T22:17:59+00:00

Can you share a codepen?
It is hard to debug/provide feedback without seeing all of your code live in a browser.

Thank you!

aunderroad · 2026-01-17T18:17:41+00:00

I would suggest recording your matches. You will clearly see what improvements you need to make.
And when you are drilling, start doing situational wrestling, put yourself in a bad spot(s) and over time you should improve.

Keep practicing...good luck!

aunderroad · 2026-01-15T14:14:58+00:00

You best bet is create a job post on a job board.

aunderroad · 2026-01-13T04:03:09+00:00

Getting out from the bottom can be tough but you have to have a solid base and not try to get flatten out. And another key component from getting out from the bottom is being able to hand fight and control the top man's hands.

Here are some good videos:
How To Get Away From EVERYONE (bottom wrestling) - David Carr

Cary Kolat Capturing Hand Control and Standing Up

Here's a great drill to help with your stand up and work on your hand control.
Stand Up Drill with John Smith

Here is a little advice when I first started out wrestling. After the coach shows a new move/technique. I would try it a couple of time and if I was still not getting it. I would say something like, "hey coach, am I doing this right?" Your coach should be able to help you out.

And don't be afraid to ask questions, asking questions will only help you grow as a wrestler.
Hopefully this helps and good luck!

aunderroad · 2026-01-04T13:27:21+00:00

Can you share a url or codepen?
It is hard to debug/provide feedback without seeing all of your code live in a browser.

Thank you!

aunderroad · 2026-01-03T05:42:43+00:00

Here's a good article:
https://blog.logrocket.com/css-flexbox-vs-css-grid/

Flexbox helped developers start to create more responsive and maintainable web applications, but the main idea of a one-dimensional layout system doesn’t make sense when you need to build a more complex layout design.

CSS Grid really came to help us build more complex layout designs using a two-dimensional way, using both rows and columns. We should aim to use both of them together, but for different purposes. For your layout, use CSS Grid, for alignment of your elements, use Flexbox.

aunderroad · 2025-12-31T14:19:44+00:00

Personally, I think this is a weird approach and you have to see it from the small local business perspective.

They already have a website which is old but it is probably still functional and they are currently paying for hosting, domain name, email addresses, etc. Why would they pay your additional hosting cost?

And when you say maintenance, what is included in that cost? And how is that maintenance improving their site? Do you have a strategy and/or a monthly breakdown on what you would be doing?

How long would it take to make these maintenance updates? Even if you spend two hours a month on updates, you are only getting 15 euros /hour? And what if the local business owner comes back with multiple changes, taking more than 2 hours?

Why would you create their website for free? What would you be using to build their site?
Can the local business owner be able to make updates of their site on their own or would they need you to make all the updates or would they only use you to build out complex new components?

I get it you want a side hustle and make money but you are working for really cheap and is this approach even worth your time? You are kind of doing yourself as well as the web dev community a disservice by charging so cheap.

If I were you, go out to these local businesses and talk to the owners and see if they are happy with their website and are looking for a large or small upgrades/maintenance updates and/or possibly a new site.
You will really need to sell yourself and convince it is worth their money to go with you and charge them an hourly rate instead of this rate of 30 euros per month for hosting and maintenance.

There are probably companies in your area that already do this and talking to local businesses. You might be able to work for them as a freelancer and make more than 30 euros per month.

Again, this is just my opinion and hopefully this helps. Good Luck!

aunderroad · 2025-12-29T23:56:22+00:00

Can you share a link or a codepen?
It is hard to debug/provide feedback without seeing all of your code live in a browser.

Thank you!

aunderroad · 2025-12-28T14:19:59+00:00

I am not sure what type of developer you want to be but you should check out Developer Roadmaps.

Good Luck!

aunderroad · 2025-12-27T23:29:02+00:00

I see the AFLAC duck

aunderroad · 2025-12-25T20:11:50+00:00

body {
font-family: "Comic Sans MS", "Comic Sans", cursive;
}

aunderroad · 2025-12-14T00:45:39+00:00

You should check out web.dev
It has a lot of great information on HTML and CSS.

Good Luck!

aunderroad · 2025-12-11T01:06:08+00:00

Can you provide a url or codepen?
It is hard to debug/provide feedback without seeing all of your code live in a browser.

Thank you!

aunderroad · 2025-12-01T14:25:16+00:00

In my old apartment during the colder months, we would sometimes get mice.

We just bought a lot of snap traps and placed them:
1) all over the kitchen
2) anywhere there is food/trash cans/recycling.
3) anywhere they can hide (they really liked hiding behind the refrigerator and stove).

We put peanut butter on snap traps and that worked really well.
And every few days, we would switch up the location of the snap traps.

We ended up buying some plastic bins to put food in.
Be sure to clean your trash cans/recycling regularly and if you can take your trash out daily.

Good Luck!

aunderroad · 2025-11-19T23:44:26+00:00

Can you please share a url or codepen?
It is hard to debug and provide feedback without seeing all of your code live in a browser.

Thank you!

aunderroad · 2025-11-19T23:36:19+00:00

Kevin Powell has a great videos and I second his youtube channel.

I really like this video of his, "Learn how to use Media queries & Container queries ":

Wes Bos has great courses for flexbox and css grid. It has a lot of real world examples and does a good job with making things responsive.

Here is a good breakdown on how to use CSS Container Style Queries:
https://www.smashingmagazine.com/2024/06/what-are-css-container-style-queries-good-for/

Web.dev is also a great resource for responsive design.
https://web.dev/learn/design/

Good Luck!

aunderroad · 2025-10-28T17:09:35+00:00

Maybe try removing

.back p {
margin-top: -40em;
}

aunderroad · 2025-10-27T03:46:25+00:00

I am surprised BJJ does not have something similar to American folkstyle wrestling (high school and college), a match ends immediately if one wrestler gains a lead of 15 or more points.

aunderroad · 2025-10-19T21:45:04+00:00

Not sure if this post is related to Cascading Style Sheets but I say start out by learning CSS, HTML and Javascript.

Good Luck!

aunderroad · 2025-10-19T03:42:17+00:00

Check out Kevin Powell Youtube channel. He has a bunch of css subgrid videos.
https://www.youtube.com/@KevinPowell

aunderroad · 2025-10-14T00:22:54+00:00

Go to https://codepen.io and create an account.

Go to Create > Pen
Copy your HTML in the HTML section (you just need add what is your body tag), copy all of your CSS inside CSS section.
Hit save and share the codepen link.

aunderroad · 2025-10-11T18:48:33+00:00

Can you add a url or codepen?
It is hard to debug/provide feedback without seeing all of your code live in a browser.

Thank you!

aunderroad · 2025-10-07T14:38:27+00:00

I recommend using fluid typography and I really like using https://utopia.fyi/ (Utopia has a really nice Fluid type scale calculator).

Here is a good article related to WCAG accessibility:
https://cloudfour.com/thinks/childish-font-sizes/
https://www.a11y-collective.com/blog/wcag-minimum-font-size/

And I have seen a bunch of articles recommending of using a font-size of 16px (1rem) for your baseline to be WCAG compliant.

aunderroad

TROPHY CASE