So, for the Tribute page project this is what i came up with:
I was wondering how can I manage the width my text takes on smaller devices, because when I open the page on my laptop it looks good but when I open it on my phone it’s fitted a little too thin than I’d like it to be. Does it have anything to do with the font I chose or the size of it or is it anything else? I’d appreciate some feedback on this and if you guys have any other remarks please do tell. Thanks in advance!
You can do so with media queries.
Click here to learn more about it or if you need a refresher.
For a small page like this you don’t need to use a media query. To help with responsiveness do not use fixed dimensions (like px) on elements. Use max-width/height and relative units like %, em, rem and vw to keep everything responsive.
@stace, I just noticed a typo in your CSS that affects the way your page displays.
- Click on the chevron in the upper right of the CSS editor and then click on the ‘Analyze’ link.
- As a suggestion switch the Syntax Highlighting in Codepen to help catch errors.
Go to your Codepen profile settings (not the setting for the pen, but for your profile). Switch the Syntax Highlighting to Oceanic Dark and save the setting. Go back to the pen and make sure your new setting is working. The code highlighting will be using different colors. Errors will now be marked in red.
This was very helpful, thank you so much!
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.