Question

我疯了，我试图将一些div（相对于视口）中心化。问题是我想要居中的那些div嵌套在一些旋转的div（4deg）中。

<g:select name="location" 
  value="${user?.location?.id}"
  from="${locations}" 
  optionKey="id" 
  optionValue="${{it.company.name + ' - ' + it.city}}"/>

我更正了嵌套在.inner-wrap{ width: 200vw; position: relative; padding: 20vh 0; right: -50vw; left: -50vw; bottom: -50px; transform-origin: bottom left; transform: rotate(-4deg);// HERE THE ROTATION margin: auto; } s

中的文章中文字的角度

.inner-wrap

问题：两次旋转让内容在左侧稍微滑动，结果有点恼人，请看链接：）

https://drive.google.com/file/d/0Bw4B9Lk7vRtda3p4TWpWNzhBZVU/view?usp=sharing

我该如何解决这个问题？

Answer 1

您可以尝试为标题添加宽度，然后使用50%和margin-left: -(half of the width of the element)将其相对于您的窗口定位。在这种情况下，我使用-140px

section.who article.logo {
    max-width: 280px;
    position: relative;
    left: 50%;
    margin-left: -140px;
}

Answer 2

好的，我是个白痴！我将旋转原点设置为左下角而不是中心....

在旋转的div中居中div

2 个答案: