Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -631,6 +631,6 @@ You could use the starting point that we have created to test out more media que

You could also experiment with adding different components and seeing whether the addition of a media query, or using a layout method like flexbox or grid is the most appropriate way to make the components responsive. Very often there is no right or wrong way — you should experiment and see which works best for your design and content.

OK, we're nearly at the end of this module. In the next article, we'll give you some tests that you can use to check how well you've understood and retained all the responsive web design and media queries information provided in the previous couple of articles.
OK, we're nearly at the end of this module. In the [next article](/en-US/docs/Learn_web_development/Core/CSS_layout/Test_your_skills/Responsive_design), we'll give you some tests that you can use to check how well you've understood and retained all the responsive web design and media queries information provided in the previous couple of articles.

{{PreviousMenuNext("Learn_web_development/Core/CSS_layout/Responsive_Design", "Learn_web_development/Core/CSS_layout/Test_your_skills/Responsive_design", "Learn_web_development/Core/CSS_layout")}}
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@ sidebar: learnsidebar
{{PreviousMenuNext("Learn_web_development/Core/CSS_layout/Test_your_skills/Responsive_design", "Learn_web_development/Core/Scripting", "Learn_web_development/Core/CSS_layout")}}
This challenge rounds off the [CSS layout](/en-US/docs/Learn_web_development/Core/CSS_layout) module by asking you to update an existing mobile layout so that it also works well on desktop browsers. Along the way, you'll also be tested on responsive layout features such as media queries, CSS grid, flexbox, and responsive images.

After you're done with this challenge, you can move on to learning about implementing dynamic behavior with [JavaScript](/en-US/docs/Learn_web_development/Core/Scripting).

## Starting point

We are going to get you to solve this challenge in your local development environment; ideally, you'll want to view the example in a full browser window to make sure the layout features are working as expected.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -95,4 +95,10 @@ While routing is traditionally handled by a server and not an application on the
> [!NOTE]
> Client-side routing can make your application feel fast, but it poses a number of accessibility problems, especially for people who rely on assistive technology. You can read more about this in Marcy Sutton's article, ["The Implications of Client-Side Routing"](https://testingaccessibility.com/implications-of-client-side-routing).

## Summary

That's it for JavaScript frameworks. We hope this module has given you a good idea of why frameworks exist and how to use them.

In the next module, we'll focus on [web accessibility](/en-US/docs/Learn_web_development/Core/Accessibility).

{{PreviousMenuNext("Learn_web_development/Core/Frameworks_libraries/React_accessibility","Learn_web_development/Core/Accessibility", "Learn_web_development/Core/Frameworks_libraries")}}
Original file line number Diff line number Diff line change
Expand Up @@ -362,6 +362,6 @@ Aside from that, try searching your favorite search engine for an answer to your

So that's JavaScript debugging and error handling. Simple huh? Maybe not so simple, but this article should at least give you a start and some ideas on how to tackle the JavaScript-related problems you will come across.

That's it for the Dynamic scripting with JavaScript module; congratulations on reaching the end! In the next module, we'll help you explore JavaScript frameworks and libraries.
That's it for the Dynamic scripting with JavaScript module; congratulations on reaching the end! In the next module, we'll help you explore [JavaScript frameworks and libraries](/en-US/docs/Learn_web_development/Core/Frameworks_libraries).

{{PreviousMenuNext("Learn_web_development/Core/Scripting/House_data_UI","Learn_web_development/Core/Frameworks_libraries", "Learn_web_development/Core/Scripting")}}
Original file line number Diff line number Diff line change
Expand Up @@ -229,4 +229,6 @@ You will know when all your errors are fixed when you see a nice little green ba

So there we have it, an introduction to debugging HTML, which should give you some useful skills to count on when debugging HTML, but also CSS and JavaScript code later on in the course. This also marks the end of the _Structuring content with HTML_ module.

Your next step is to start learning about styling the web in our [CSS styling basics](/en-US/docs/Learn_web_development/Core/Styling_basics) module.

{{PreviousMenuNext("Learn_web_development/Core/Structuring_content/Forms_challenge", "Learn_web_development/Core/Styling_basics", "Learn_web_development/Core/Structuring_content")}}
Original file line number Diff line number Diff line change
Expand Up @@ -178,7 +178,7 @@ As you become more experienced with CSS, you will find that you get faster at fi

So there we have it: an introduction to debugging CSS, which should give you some useful skills to count on when you start to debug CSS and other types of code later on in your career.

That's it for all the lessons in this module. To finish it off, we'll test your knowledge of the topics covered with a series of challenges.
That's it for this module. Once you're ready, you can move on to our [CSS text styling](/en-US/docs/Learn_web_development/Core/Text_styling) module.

## See also

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -194,7 +194,9 @@ Let's go through it to see what it does:

## Summary

Now that you have worked through our articles on text styling fundamentals, it's time to test your comprehension with our challenge for the module: Typesetting a community school homepage.
Now that you have worked through our articles on text styling fundamentals, it's time to test your comprehension with our challenge for the module: [Typesetting a community school homepage](/en-US/docs/Learn_web_development/Core/Text_styling/Typesetting_a_homepage).

Once you're done with the challenge, you can move on to learning about [CSS layout](/en-US/docs/Learn_web_development/Core/CSS_layout).

## See also

Expand Down
6 changes: 5 additions & 1 deletion files/en-us/mozilla/firefox/releases/152/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,11 @@ Firefox 152 is the current [Beta version of Firefox](https://www.firefox.com/en-

## Changes for web developers

<!-- ### Developer Tools -->
### Developer Tools

- The developer tools now have a "Show comments" option to toggle the display of HTML comment nodes in the Inspector.
This option can be found in the [Settings panel](https://firefox-source-docs.mozilla.org/devtools-user/settings/index.html#settings-inspector).
([Firefox bug 1455294](https://bugzil.la/1455294)).

<!-- ### HTML -->

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/web/api/element/closest/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ closest(selectors)

### Return value

The closest ancestor {{domxref("Element")}} or itself, which matches the `selectors`. If there are no such element, `null`.
The closest ancestor {{domxref("Element")}} or itself, which matches the `selectors`. If there is no such element, `null` is returned.

### Exceptions

Expand Down
11 changes: 6 additions & 5 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.