Category "css"

h1 element in div behaving differently with other divs

So I have looked everywhere on stack overflow and counldn't find someone with a similar issue. I have two classes in the main body with a few different images i

Apply css class to a <div> generated by an <ng-template> within the <ngx-datatable-column>

I am trying to apply display: flex property to the parent <div> of my <span> but since the is generated by the ng-template of the ngx-datatable-col

My table border doesn't want itself not to be collapsed

I was trying to make a table with borders but suddenly they disappeared. I tried border-collapse: separate; but it didn't work. I am using bootstrap too. Is it

Woocommerce - hide an element if logged in, show element if logged out

i've found the following code to make an element change to display:block; if a user is logged in .logged-in .price{ display: none; } and also <?php if ( i

how to center modal and have it come underneath the link button?

I have a front page that has 4 links, and each link is suppose to open up a modal. However for instance on the first link 'Vente' in my code the modal only come

Set CSS colours from server side

Background We currently have large client site in Optimizely (ASP.NET MVC) which hosts many, smaller sites, for their regional markets and large, important cust

Performance improvements for split screen with scroll overflow

Edit: Turns out the performance problems only happen during development. Once Gatsby builds the project, everything runs well. I'd be curious to hear if anyone

Position a button on the right of each row with overflow-x

I want to add a button next to each row of my table. Plot twist, the table is inside a div with a fixed width and overflow-x for responsiveness. I want the butt

Tailwind CSS No Utility Classes Were Found

Trying to get Tailwind to work via CLI instructions here. I've got a (simplified) file structure of -public -stylesheets -styles.css -tailwind.css -v

Min and max width issues [duplicate]

I used the @media (min-width:320px) and noticed my design from mobile scaling back to desktop had inherited my mobile design. changed to max-w

Trying to position searchbar in nav

I made a nav bar, and I'm trying to add a search bar to it, but I can't seem to position it. I'd like to have the search bar show on the right side of the nav b

How to set up the counter when it is detected

In my project, there should be a counter. I have used the "reveal function". I want the counter to start when it goes to "reveal function". And when the bottom-

sticky sidebar in a post not working (tailwind)

I'm looking to make something similar to this As you can see, when you scroll the sidebar follows you. This is my code, i can't make it work: <template>

I am trying to display 3 columns in 1 row

In my shopify section I am trying to display a section like this that I can add to my homepage. The issue is that I am using a shopify liquid schema with the f

Wordpress ACF dynamic status bar

I am in the process of creating a order tracker using Wordpress, ACF, and a yet to be decided form plugin for use on the front-end. The back-end is working just

Email body contents get jumbled up if below html emailed

I am processing raw data with powershell then populating hash tables. Then i am generating report out of hash table. I am generating HTML file as a report. This

Element touching the edge of the screen on mobile (Material UI)

New to MUI. My element seems to be touching the edge of the screen on mobile. I tried adding padding and margins but it just squeezes the element. https://code

How to check in SCSS if a variable exists and ha a value?

I am new in SCSS so bear with me :) I have a use case where a SCSS variable --my-variable can exist and can have a value depending on some settings from the bac

Render a string in HTML and preserve spaces and linebreaks

I have an MVC3 app that has a details page. As part of that I have a description (retrieved from a db) that has spaces and new lines. When it is rendered the ne

How to make interactive active line when clicked with react

I have 3 lists of a clickable links, so when you click one you go to that section and the line too. so this is my code : <div className="description-containe