Lemmy.one
  • Communities
  • Create Post
  • heart
    Support Lemmy
  • search
    Search
  • Login
  • Sign Up
King@sh.itjust.works to Programmer Humor@programming.devEnglish ·
edit-2
5 days ago

Centering a Div

i.ibb.co

message-square
61
fedilink
292

Centering a Div

i.ibb.co

King@sh.itjust.works to Programmer Humor@programming.devEnglish ·
edit-2
5 days ago
message-square
61
fedilink

comiCSS

alert-triangle
You must log in or # to comment.
  • tiredofsametab@fedia.io
    link
    fedilink
    arrow-up
    65
    ·
    5 days ago

    <CENTER><DIV>just as the founders intended</DIV></CENTER>

    / If your language has 58 ways to accomplish something like that, you’re in for a bad time.

  • Ensign_Crab@lemmy.world
    link
    fedilink
    English
    arrow-up
    12
    ·
    edit-2
    4 days ago

    It’s nonintuitive and could have been designed better from the outset, but it’s not impossible or even difficult. Now can we fight about something meaningful?

    vim and emacs are right there, people.

    • Jankatarch@lemmy.world
      link
      fedilink
      arrow-up
      4
      ·
      edit-2
      3 days ago

      Emacs has a better file-manager and you can setup an extremely great latex-editor.

      Also extensions don’t randomly not work on bsd as much. There is even evil-mode and no-window option.

      The only place vim wins at is that there is an optional and lightweight autcomplete with lsp support you can activate by pressing <C-n> or <C-p> in gvim during interactive mode.

      And NOBODY uses it.

      • luciferofastora@feddit.org
        link
        fedilink
        arrow-up
        4
        ·
        3 days ago

        Vim has one critical advantage though:

        I learned it first

  • hperrin@lemmy.ca
    link
    fedilink
    English
    arrow-up
    36
    ·
    5 days ago

    Centering a div is pretty fucking easy nowadays. What’s way harder is aligning a god damned SVG icon with text.

    • The_Decryptor@aussie.zone
      link
      fedilink
      English
      arrow-up
      2
      ·
      3 days ago
      <p><svg class="icon">...</svg> Text</p>
      
      p .icon {
          --size: 1.25em;
          vertical-align: calc(0.5cap - 0.5 * var(--size));
          height: var(--size);
          width: var(--size);
      }
      

      Done.

      • hperrin@lemmy.ca
        link
        fedilink
        English
        arrow-up
        3
        ·
        3 days ago
        • Doesn’t work with non-square icons.
        • Doesn’t align with multi-line text (text wraps to underneath icon).
        • Only aligns centered (no baseline).

        But that’s pretty good for most cases.

        • The_Decryptor@aussie.zone
          link
          fedilink
          English
          arrow-up
          2
          ·
          3 days ago

          Ahh, yeah that’s a bit harder, CSS multiline stuff is pretty flaky from what I can recall. You need to drop down to block layout, e.g. making the containing element a flex parent (Better term than that?) and then making the icon centered within that can work, but then we’re back to square one with sizing the icon.

    • YoSoySnekBoi@kbin.earth
      link
      fedilink
      arrow-up
      13
      ·
      4 days ago

      Even that is pretty easy nowadays with modern CSS:

      <div> <svg /> Text </div>
      
      div {
          display: flex;
          align-items: center;
      
          /* If the SVG needs an offset */
          & svg {
              --offset: ...px, ...px;
              transform: translate(var(--offset));
          }
      }
      
      • onlinepersona@programming.dev
        link
        fedilink
        arrow-up
        15
        ·
        4 days ago

        Yeah. Easy. So easy. Text size changes, svg not centered anymore. Add margin (or whatever that inside margin is called), and tada, not centered.

        • funkless_eck@sh.itjust.works
          link
          fedilink
          arrow-up
          16
          ·
          4 days ago

          padding

          At the risk of getting flamed - I wonder if because CSS is a design tool not a programming tool, it will seem unintuitive to people from a technical background, but more intuitive to people from a design/arts background

          • TrickDacy@lemmy.world
            link
            fedilink
            arrow-up
            10
            ·
            edit-2
            4 days ago

            Exactly this ^

            When we had “backend” people at my shop, they were god awful at css. It was so bad at one point that I scolded any backend person who touched css because they always fucked shit up if they did.

            • Phunter@lemmy.zip
              link
              fedilink
              arrow-up
              15
              ·
              4 days ago

              I fuck up CSS on purpose whenever possible to reduce the likelihood of anyone letting me near it.

              • TrickDacy@lemmy.world
                link
                fedilink
                arrow-up
                7
                ·
                4 days ago

                Maybe you used to work with me? haha

          • onlinepersona@programming.dev
            link
            fedilink
            arrow-up
            8
            ·
            4 days ago

            I think you’re right. CSS was more understandable to me after reading that it came from the world of print media. It’s how things were laid out there and it was transformed into a language from those with domain knowledge.

            But I would be curious if those who studied art also use the same terminology. If so, then it would make sense that it would seem more intuitive to them.

      • 4am@lemmy.zip
        link
        fedilink
        arrow-up
        3
        ·
        4 days ago

        Still using div in 2025

        No

        • YoSoySnekBoi@kbin.earth
          link
          fedilink
          arrow-up
          7
          ·
          4 days ago

          I’m confused - it’s the only non-semantic standard html container. Ofc it’s bad if you’re trying to communicate intent, but if it’s just for minor layout tweaks, anything else would mess with the document structure. Find me one sufficiently complex website that doesn’t use divs lol

          • irelephant [he/him]@programming.dev
            link
            fedilink
            arrow-up
            2
            ·
            3 days ago

            I actually nest everything in <p>s

  • TrickDacy@lemmy.world
    link
    fedilink
    arrow-up
    26
    ·
    4 days ago

    Do people who talk this kind of shit about css really not understand they’re just admitting they’re not good at css?

    • 𝕱𝖎𝖗𝖊𝖜𝖎𝖙𝖈𝖍@lemmy.world
      link
      fedilink
      arrow-up
      3
      ·
      edit-2
      3 days ago

      Same with people who complain endlessly about JS/TS letting you add a string to an object. I work with this shit daily, these are literally the least of my problems.

      • TrickDacy@lemmy.world
        link
        fedilink
        arrow-up
        1
        ·
        2 days ago

        Totally agree.

    • cbazero@programming.dev
      link
      fedilink
      arrow-up
      24
      ·
      4 days ago

      If you need to be good at a layout language to center something, then maybe the layout language sucks.

      • irelephant [he/him]@programming.dev
        link
        fedilink
        arrow-up
        4
        ·
        3 days ago

        You literally just have to give it a width and add margin: 0 auto;

        • humorlessrepost@lemmy.world
          link
          fedilink
          English
          arrow-up
          3
          ·
          edit-2
          2 days ago

          I think it’s implied they’re talking about centering both horizontally and vertically. And probably with unknown height.

          Still easy these days , though.

        • 𝕱𝖎𝖗𝖊𝖜𝖎𝖙𝖈𝖍@lemmy.world
          link
          fedilink
          arrow-up
          2
          ·
          edit-2
          3 days ago

          Or use Flexbox

          But your solution works as well for simple cases

          • irelephant [he/him]@programming.dev
            link
            fedilink
            arrow-up
            1
            ·
            1 day ago

            I generally avoid flex for simple stuff (i like weird browsers), but for more complex layouts it should certainly be used.

      • TrickDacy@lemmy.world
        link
        fedilink
        arrow-up
        9
        ·
        4 days ago

        What it says is zero knowledge on the part of the whiner.

    • Whelks_chance@lemmy.world
      link
      fedilink
      arrow-up
      23
      ·
      4 days ago

      If it were designed properly you wouldn’t need to be good at it, it would be trivial and obvious to do the only thing anyone ever needs to do to their content within an area of the page

      • TrickDacy@lemmy.world
        link
        fedilink
        arrow-up
        32
        ·
        edit-2
        4 days ago

        Good news: centering a div is insanely easy to do and has been for like 15 years.

        • Windex007@lemmy.world
          link
          fedilink
          arrow-up
          18
          ·
          4 days ago

          You probably didn’t expect that comment to make me feel so old.

          • TrickDacy@lemmy.world
            link
            fedilink
            arrow-up
            2
            ·
            4 days ago

            Haha, sorry bout that. If it makes you feel any better, I felt pretty old about writing it too!

        • GenderNeutralBro@lemmy.sdf.org
          link
          fedilink
          English
          arrow-up
          4
          ·
          4 days ago

          The last time I did any html/css work was about 15 years ago. Now I’m curious what’s changed.

          • myotheraccount@lemmy.world
            link
            fedilink
            arrow-up
            8
            ·
            4 days ago

            flex box, grid layout, and a million other things

    • Quibblekrust@thelemmy.club
      link
      fedilink
      English
      arrow-up
      4
      ·
      3 days ago

      I’m not good at programming Brainfuck, either.

      • TrickDacy@lemmy.world
        link
        fedilink
        arrow-up
        2
        ·
        3 days ago

        You probably haven’t put any effort into learning either language. I find that people who whine about css to normally be backend programmers who are really terrible at design and want a scapegoat to blame.

        • Quibblekrust@thelemmy.club
          link
          fedilink
          English
          arrow-up
          2
          ·
          2 days ago

          You have a real fuckin’ hard-on for CSS, don’t ya?

          • TrickDacy@lemmy.world
            link
            fedilink
            arrow-up
            1
            ·
            2 days ago

            I have side eye for those with hate boners for it

            • Quibblekrust@thelemmy.club
              link
              fedilink
              English
              arrow-up
              2
              ·
              2 days ago

              You think my joke was a “hate boner”? You need to smoke grass or touch weed or something.

              • TrickDacy@lemmy.world
                link
                fedilink
                arrow-up
                1
                ·
                2 days ago

                I think you are misunderstanding a lot here

                • Quibblekrust@thelemmy.club
                  link
                  fedilink
                  English
                  arrow-up
                  2
                  ·
                  2 days ago

                  Nope. I have you pegged.

  • Korthrun@lemmy.sdf.org
    link
    fedilink
    arrow-up
    14
    ·
    4 days ago

    Lol, easier to write an article theorizing the ways it can be done than to just show him a centered div.

  • squirrel@piefed.kobel.fyi
    link
    fedilink
    English
    arrow-up
    22
    ·
    5 days ago
    div {
      display: grid;
      place-items: center;
    }
    
  • Katherine 🪴@piefed.social
    link
    fedilink
    English
    arrow-up
    1
    ·
    3 days ago

    deleted by creator

  • finitebanjo@piefed.world
    link
    fedilink
    English
    arrow-up
    20
    ·
    edit-2
    3 days ago

    deleted by creator

  • Eskuero@lemmy.fromshado.ws
    link
    fedilink
    arrow-up
    13
    ·
    4 days ago

    <center></center>

  • jaschen306@sh.itjust.works
    link
    fedilink
    arrow-up
    1
    ·
    3 days ago

    I manage a small website and the CSS images messes with your core web vitals.

    You can’t lazy or eager load css so it basically render blocks everything.

  • onlinepersona@programming.dev
    link
    fedilink
    arrow-up
    12
    ·
    4 days ago

    CSS is trash. Always has been, always will be.

    • TrickDacy@lemmy.world
      link
      fedilink
      arrow-up
      33
      ·
      4 days ago

      Skill issue.

      • onlinepersona@programming.dev
        link
        fedilink
        arrow-up
        9
        ·
        4 days ago

        Yeah, using trash is definitely a skill issue. You’re right about that.

        • TrickDacy@lemmy.world
          link
          fedilink
          arrow-up
          8
          ·
          4 days ago

          So you’re saying it’s a skill issue that you try something you’re bad at? Seems unnecessarily hard on yourself.

          • onlinepersona@programming.dev
            link
            fedilink
            arrow-up
            6
            ·
            4 days ago

            I do not envy the monkey apt at throwing shit. If you find it a useful aptitude, good for you.

            • TrickDacy@lemmy.world
              link
              fedilink
              arrow-up
              9
              ·
              4 days ago

              Again I go back to: you’re just telling everyone you’re not good at it. Whine all you want, the web will not be dropping css anytime soon.

              • onlinepersona@programming.dev
                link
                fedilink
                arrow-up
                7
                ·
                4 days ago

                So what, it’s still a trash language.

                • TrickDacy@lemmy.world
                  link
                  fedilink
                  arrow-up
                  8
                  ·
                  4 days ago

                  Error: runaway loop detected.

  • LumpyPancakes@piefed.social
    link
    fedilink
    English
    arrow-up
    9
    ·
    5 days ago

    I only know how to stick it in a cell in a table and center the cell.

    Never learned css, a bit left behind now hehe.

  • velindora@lemmy.cafe
    link
    fedilink
    English
    arrow-up
    1
    ·
    4 days ago

    What is Temani?

    • tiredofsametab@fedia.io
      link
      fedilink
      arrow-up
      1
      ·
      4 days ago

      I assumed it was a personal name, but I don’t know.

Programmer Humor@programming.dev

programmer_humor@programming.dev

Subscribe from Remote Instance

Create a post
You are not logged in. However you can subscribe from another Fediverse account, for example Lemmy or Mastodon. To do this, paste the following into the search field of your instance: !programmer_humor@programming.dev

Welcome to Programmer Humor!

This is a place where you can post jokes, memes, humor, etc. related to programming!

For sharing awful code theres also Programming Horror.

Rules

  • Keep content in english
  • No advertisements
  • Posts must be related to programming or programmer topics
Visibility: Public
globe

This community can be federated to other instances and be posted/commented in by their users.

  • 386 users / day
  • 3.16K users / week
  • 7.81K users / month
  • 17.5K users / 6 months
  • 197 local subscribers
  • 28K subscribers
  • 2.02K Posts
  • 77.6K Comments
  • Modlog
  • mods:
  • Feyter@programming.dev
  • adr1an@programming.dev
  • BurningTurtle@programming.dev
  • Pierre-Yves Lapersonne@programming.dev
  • BE: 0.19.7
  • Modlog
  • Legal
  • Instances
  • Docs
  • Code
  • join-lemmy.org