css Question posted in
Some basic documentation can be found here.

Css – Can someone put this element in the middle?

Problem solved. thanks for ideas from answers.

i want to make this element in middle in mobile. i tried couple trick like "text-algin:center" but it didn’t work.
can anyone help me to get the css code for that?
element in footer:

link image 1: https://phpout.com/wp-content/uploads/2024/04/ir1zf.png
in desktop it is good.

link image 2: https://phpout.com/wp-content/uploads/2024/04/1MMqq.png
in mobile i want

website: https://xxxx.xx/ (edited)

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    although @AngYC comments wasn't the right answer but it help me to figure out. .footer_list ul li is main key. solution:

    @media only screen and (max-width: 576px)
{
.footer_list ul li
    {
    flex: 10 0 auto !important;
  width: 100% !important;
}
}

  2. 0

    Change the column class of the footer_list container from col-6 to col-12 to set the column width to 100% in the mobile screen resolution. Secondly, remove the float CSS property from the .footer_list ul li element. That’s it, Make sure that you have text-align: center; CSS property set to the desired element (li) or its container. (Which is already the case in the provided website link). I hope this helps you.

    My personal suggestion: Using float is the old-school way of styling in CSS. I recommend you to learn the new Flexbox and CSS Grid. My recommended YouTube channel name is: "Slaying The Dragon"

    Learn CSS Grid: https://youtube.com/watch?v=EiNiSFIPIQE

    Learn CSS Flexbox: https://youtube.com/watch?v=phWxA89Dy94

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search