Breaking News: Grepper is joining You.com. Read the official announcement!

put item in center css

Add Answer

Nanu answered on August 4, 2021 Popularity 6/10 Helpfulness 6/10

answer put item in center css

related how to center items in css

related how to center an element in css

related center item

related how to put an element in the center css

put item in center css

Comment

<div><span style="display: inline-block;width: 30%"></span><span style="display: inline-block;
                    width: 30%;text-align: center;"> <button class="ml-3" mat-flat-button [color]="'primary'"
                    (click)="onSubmit()">
                    <mat-icon [svgIcon]="'oxalis:icon_save'"></mat-icon>Submit
                </button></span><span style="display: inline-block;
        width: 40%"></span></div>

Popularity 6/10 Helpfulness 6/10 Language css

Source: Grepper

Tags: center css put

Link to this answer
Share Copy Link

Contributed on Mar 04 2024

Nanu

0 Answers Avg Quality 2/10

Closely Related Answers

how to center items in css

Comment

{{-- this is my code 

there is two ways to do it
the first method using flex box
--}}

<html>
<body>
<style>
    .center {
        display: flex;
        align-items: center;
        justify-content: center;
    }
</style>

<div>
    <h1 class="center">title</h1>
    <h4 class="center">body</h4>
    <div class="center">
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" height="400px" width="400px" >
    </div>
</div>
</body>
</html>

{{-- 
but the problem with this method that you need to give each element the center class
and in the case of some elments such as an image you need to wrap it inside a div
and pass the center class to it
--}}






{{--  the other way is using css grid --}}

<style>
    .center {
        display: grid;
        place-items: center;
    }
</style>

<div class="center">
    <h1 >title</h1>
    <h4>body</h4>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" height="400px" width="400px" >
</div>

{{--
the cool thing about this method that you just need to pass the center class,
in the parent div and evreything inside this div will be centered
and for example you dont need to put the image elemnt in a div in order for it to work
--}}

Popularity 10/10 Helpfulness 10/10 Language css

Source: Grepper

Tags: center ce

Link to this answer
Share Copy Link

Contributed on Nov 28 2021

Wide-eyed Wryneck

0 Answers Avg Quality 2/10

how to center an element in css

Comments(1)

.container{
  display:bock;
  width:fit-content;
  margin:auto;
}

Popularity 10/10 Helpfulness 7/10 Language css

Source: Grepper

Tags: center ce

Link to this answer
Share Copy Link

Contributed on Sep 23 2021

Unsightly Unicorn

0 Answers Avg Quality 2/10

how to center an element in css

Comment

.element {
  position: absoloute;
  margin: auto;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

Popularity 10/10 Helpfulness 6/10 Language css

Source: Grepper

Tags: center ce

Link to this answer
Share Copy Link

Contributed on Aug 04 2021

Aiden Patel

0 Answers Avg Quality 2/10

center item

Comment

something {
	display: grid;
    place-items: center;
}

Popularity 10/10 Helpfulness 6/10 Language css

Source: Grepper

Tags: center ce

Link to this answer
Share Copy Link

Contributed on Aug 02 2022

Healthy Hornet

0 Answers Avg Quality 2/10

how to put an element in the center css

Comment

.element {
    margin: auto;
}

Popularity 10/10 Helpfulness 3/10 Language css

Source: Grepper

Tags: center ce

Link to this answer
Share Copy Link

Contributed on Jun 18 2022

RSteepbroR

0 Answers Avg Quality 2/10

put item in center css

Contents

More Related Answers

put item in center css

Closely Related Answers

how to center items in css

how to center an element in css

how to center an element in css

center item

how to put an element in the center css

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.