Hardest Problem in Computer Science: Centering Things (tonsky.me)

submitted 7 months ago by Ephera@lemmy.ml to c/webdev@programming.dev

10 comments fedilink hide all child comments

you are viewing a single comment's thread
view the rest of the comments

[-] IllNess@infosec.pub 2 points 7 months ago

I don't want to step on any toes but your CSS only works on the home page.

I added more CSS for it to work on the fan pages:

@-moz-document domain("fandom.com") {
    .global-navigation {
        display: none;
    }

    body > .main-container {
        margin-left: 0 !important;
    }

    body {

        margin-left: 0 !important;

        & > .main-container {

            width: 100% !important;

            margin-left: 0 !important;
        }

        & > .fandom-sticky-header {
            left: 0 !important;
        }
    }
}

[-] Ephera@lemmy.ml 2 points 7 months ago

Ah, absolutely no toes stepped on. I've never used Fandom myself, this was just what I could whip up real quick.

If you happen to use Fandom more often, maybe you'd like to publish this in Stylus? Even if it's just as a personal backup.
I mainly didn't do it, because without me using Fandom, the user style could be broken by tomorrow.

P.S.: I think, the first body > .main-container {-block can be removed, as you set the same style in the nested block underneath...

[-] IllNess@infosec.pub 2 points 7 months ago

Yes, you are correct. Good catch.

    @-moz-document domain("fandom.com") {
        .global-navigation {
            display: none;
        }

        body {
            margin-left: 0 !important;

            & > .main-container {
                width: 100% !important;
                margin-left: 0 !important;
            }

            & > .fandom-sticky-header {
                left: 0 !important;
            }
        }
    }

It was very nice of you to write this out for the other guy. I will look through the uploads and see if anyone else has the same idea.

this post was submitted on 20 Apr 2024

27 points (90.9% liked)

Web Development

3430 readers

38 users here now

Welcome to the web development community! This is a place to post, discuss, get help about, etc. anything related to web development

What is web development?

Web development is the process of creating websites or web applications

Rules/Guidelines

Follow the programming.dev site rules
Keep content related to web development
If what you're posting relates to one of the related communities, crosspost it into there to help them grow
If youre posting an article older than two years put the year it was made in brackets after the title

Related Communities

Wormhole

!cool_github_projects@programming.dev

Some webdev blogs

Not sure what to post in here? Want some web development related things to read?

Heres a couple blogs that have web development related content

https://frontendfoc.us/ - [RSS]
https://wesbos.com/blog
https://davidwalsh.name/ - [RSS]
https://www.nngroup.com/articles/
https://sia.codes/posts/ - [RSS]
https://www.smashingmagazine.com/ - [RSS]
https://www.bennadel.com/ - [RSS]
https://web.dev/ - [RSS]

Credits

Icon base by Delapouite under CC BY 3.0 with modifications to add a gradient

founded 1 year ago

MODERATORS

snowe@programming.dev

erlingur@programming.dev

Ategon@programming.dev