Css Вырывание по центру

How to center align container div?

Please post your html and css code here.
Which challenge is in question, and what step you are talking about?

    <div className='cont'>
    <div className='app'>
      <div className='counter'>{state}</div>
      <div className='controls'>
        <button onClick={() => onChangeCounter(1)}>INC</button>
        <button onClick={() => onChangeCounter(-1)}>DEC</button>
        <button onClick={() => onRandomCounter(-50,50)}>RND</button>
        <button onClick={() => onResetCounter()}>RESET</button>

мне нужно что бы cont ,был по центру.

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

1 Like

Я поняла спасибо за подсказку.

Так кто знает ответ на мой вопрос?

It kind of depends on the total context of the app styles. It would help if you posted a live example on something like StackBlitz.

But using CSS grid is one way.

<div class="container">
  <div class="box"></div>
.container {
  min-height: 100vh;
  display: grid;
  place-items: center;

.box {
  background: red;
  height: 200px;
  width: 200px;


1 Like

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.