105
Comments
  • 5
    meh
    HorizontalAlignment="Center"
    #just_xaml_things
  • 2
    @bigworld12
    android:layout_centerInParent="true"
    Or
    Constraint layout
    #justAndroidThing

    But ya wen is pretty much annoying but things are getting easy I guess, not a web dev tbh
  • 0
    @bigworld12 by the way xaml designing is so easy and gets shit done in no time, then comes Android then never iOS and web lol
  • 6
    Before flexbox maybe, but, with flexbox:

    .container {

    display: flex;

    align-items: center;

    justify-content: center;

    }
  • 2
    Position: absolute;
    Top: 50%;
    Transform: TranslateY(-50%);
    Bam!
  • 0
    @tizo did it work with overflow?
  • 1
    @tizo this is oldschool, i use all the time. Works with older browsers real good. I do top:50%; left:50%; transform:translate(-50%,-50%); to cemter it vertically and horizontaly
  • 0
    Left: calc(<halfparentwidth> - <halfwidth>);
  • 1
    Thank god for flexbox eh? We can finally do something tables could do in the 90s. Not that I'm advocating tables, that would be crazy.
  • 0
    @vicary it will center the element to whatever the nearest parent element with position: relative is.
  • 0
    @tizo Centering usually comes with the constraint of parent container size, mimicking background-size: cover/contain in some way. Last time I messed with translate-* family they renders the element in another plane of existence where you can’t do anything with overflow and z-index.
Add Comment