I have a simple html hierarchy: <div> <div> <div class="custom-class">whatever</div> </div> <div> <div class="custom-class">whatever</div> </div> <div> <div class="custom-class">thing i want to select</div> </div> </div> I am currently adding attributes to .custom-class but would like to add a specific attribute to…
Sample image of the situation I am building a portfolio with bootstrap and I have carousal on the top, but it is overflowing more which make it to scroll horizontally. Carousal html <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators"> <li…
Not sure if I'm tired or what. Trying to make setup where there are multiple elements with span class which when hovered upon will make appear some text in a Div. Any tips on how to make this work and…
I need some help as I am a complete newbie when it comes to HTML and CSS. I am trying to create something like this: I can generate the entire container itself but the placement of the Blog Title, Blog…
I want several text links that when they are hovered over a text is displayed below in a DIV. For example if text called Ice cream is hovered upon with mouse then below in DIV a text is displayed about…
I'm trying to create an effect where I have 3 lines of text. The text in the middle signifies the "now". The text on the bottom signifies "yesterday" and text above signifies "tomorrow". The "effect" is that the text is…
I am building a date picker from scratch as a learning exercise. My date picker has two months side by side, and my question is, what does the jQuery look like for picking a start date and end date, allowing…
I built a simple breakout layout using Rachel Andrew's documentation https://rachelandrew.co.uk/archives/2017/06/01/breaking-out-with-css-grid-explained/ I would like to adjust the layout so that the menu items are centered. To be more specific, I want the first menu item to align with the content,…
I have a div <div class="arrow-up"> that defines a triangle using CSS. Here's an example : .arrow-down { width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-top: 20px solid #f00; } <div class="arrow-down"></div> I'm trying to…
I'm working on a layout where I need the header of a horizontally scrollable middle table to remain sticky at the top while scrolling vertically. The headers for the left and right tables stick just fine, but I'm having trouble…