Jaydeep Shah Ответов: 1

Центральное изображение с помощью CSS

я хочу центрировать изображение и текст. но не надо никакой работы.

Что я уже пробовал:

<style>
    .centerimage {
        top:0;
        right:0;
        left:0;
        bottom:0;
    }
</style>



<div class="centerimage">
    <img src="~/Content/LeaveGrp.jpg" style="margin:0px 0px 0px 0px" />
    <p>you left the group</p>
</div>

1 Ответов

Рейтинг:
9

jgakenhe

Взгляните ниже. Я добавил position absolute с left и top Это должно приблизить вас к тому, что вы хотите; хотя вам, вероятно, придется немного подправить его. Ниже приведен обновленный тест вашего образца.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
 <head>
  <title> New Document </title>
    <style>
    .centerimage {text-align: center;
    position:absolute;
    left:50%;
    top:50%;
    }
</style>
 </head>
 <body>
<div class="centerimage" style="border: 1px solid #000;">
    <img src="https://codeproject.global.ssl.fastly.net/App_Themes/CodeProject/Img/logo250x135.gif" />
    <p>you left the group</p>
</div>
 </body>
</html>

Jaydeep Shah

Эй, спасибо, но мне нужен был именно центр экрана
вертикально и горизонтально тоже.

jgakenhe

Я обновил его, чтобы центрировать по горизонтали и вертикали. Это должно быть близко к тому, что вам нужно.

Jaydeep Shah

Спасибо! :)