Vertical centering in gwt

like vertical centering in gwt using a vertical panel .. or pls sugest me is there any way for vertical measurement

+3
source share
2 answers

If you want to directly use the code VerticalPanelfrom the code, you need to usesetVerticalAlignment(HasVerticalAlignment.ALIGN_MIDDLE)

You can also use the UiBinder approach

<g:VerticalPanel verticalAlignment='ALIGN_MIDDLE' horizontalAlignment='ALIGN_CENTER' width="100%" height="500px">
  <g:cell></g:cell>
</g:VerticalPanel>

Take a look at DevGuideUiPanels for examples and documentation.

+6
source

I can give an example of how we did this with css (to implement a popup type).

Google, , . , , .

<!DOCTYPE html>
<html>
  <head>
    <style>
        * {
            margin: 0 auto; 
        }

        .popup {
            border-color:#ff4f00;
            border-style:solid;
            border-width:5px;
            background-color: #ffffff;
            text-align: left;
        }

        #wrapper, #container {
            height: 150px;
            width: 550px;
        }

        #wrapper {
            bottom: 50%;
            right: 50%;
            position:
            absolute;
        }

        #container {
            left: 50%;
            position: relative;
            top: 50%;
        }
    </style>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>vertical centering</title>
  </head>
  <body>
    <div style="width: 965px; height: 515px;"></div>
    <div id="wrapper">
        <div class="popup" id="container">
            some content
        </div>
    </div>
  </body>
</html>

EDIT: .

+1

Source: https://habr.com/ru/post/1775155/


All Articles