How to position svg that underlines a text properly
I have to get this svg positioned rigth below the text (with a min space between the text and the svg) and it has to follow the size of the text (which changes according to the width of the screen)
By now the svg is positioned like this:
Html:
` <h2 class="dark-olive-text bolder">...
I wanna make a span inside the html code, and make it changeable in js, only some editable
I wanna make a command-line like part of my CHARITY escape room.
codepen: https://codepen.io/Zrizzy/pen/LYMwqJM...
Mouse Interactions and Frontend help
I need help with three aspects of my web portfolio's about section, I am currently just going focus on a specific part which i will provide a Codepen link that is similar to what I have (I'm currently using nextjs and styled component in my personal project):
Link: https://codepen.io/jorgeo/pen/jOXebZZ
1. Eye Animation and Mouse Interaction:...
Need help with styling specific tags/elements
So, i did achieve this design but now i was implementing it in a better way using grids and relative units to avoid breaking and too much wrapper divs.
The screenshot i shared is the design i created using flexbox and not best practices. But it is the actual design.
Here is the codepen of what i am trying to do now :
https://codepen.io/Zeshan-Merchant/pen/NWeQpZW...
Icons are not centered in half screen
I have tried everything I know, but I'm a little rusty
codepen: https://codepen.io/Zrizzy/pen/NWeQgGv
<!DOCTYPE html>
<html lang="en">...
Conform container size to centered grid content
Hello! In this Codepen I have a grid of items that uses auto-fit to keep them centered within a container (using
margin-inline: auto). I also have a navbar using that same container class. Is there a way that I can keep the width of the navbar consistent with the main content as the page resizes? I've attached a mock-up image of the desired effect - note how the edge of each container matches.
Flexbox and borders
Hello there
I have a block of text and and an empty div with background color and want to layout them horizontally using flexbox. All works great until I add border to the empty div. For some reason the borders are not accounted for the width and instead added on top of the resulted width of the div. As a result the div is wider than the text block. the box-sizing property for everything is set to border-box if that's relevant.
Is this the expected outcome?...
