如何将图像放在正确的div中？

-1

下部的代码看起来如下：

1）HTML：

<div class="content"> 
    <div class="contentLeftPart"> 
     @using (Html.BeginForm("Login", "Account", new {ReturnUrl = ViewBag.ReturnUrl}, FormMethod.Post, new {@class = "form-horizontal", role = "form"})) 
     { 
      @Html.AntiForgeryToken() 
      @Html.ValidationSummary(true) 
      <div class="form-group"> 
       @Html.LabelFor(m => m.UserName, new {@class = "col-md-2 control-label"}) 
       <div class="col-md-10"> 
        @Html.TextBoxFor(m => m.UserName, new {autofocus = "autofocus", @class = "textinput"}) 
        @Html.ValidationMessageFor(m => m.UserName) 
       </div> 
      </div> 
      <div class="form-group"> 
       @Html.LabelFor(m => m.Password, new {@class = "col-md-2 control-label"}) 
       <div class="col-md-10"> 
        @Html.PasswordFor(m => m.Password, new {@class = "textinput"}) 
        @Html.ValidationMessageFor(m => m.Password) 
       </div> 
      </div> 
      <div class="form-group"> 
       <div class="col-md-offset-2 col-md-10"> 
        <div class="checkbox"> 
         @Html.CheckBoxFor(m => m.RememberMe) 
         @Html.LabelFor(m => m.RememberMe) 
        </div> 
       </div> 
      </div> 
      <p class="form-group"> 
       <div class="col-md-offset-2 col-md-10"> 
        <input class="btn" type="submit" value="Логин"/> 
       </div> 
      </p> 
     } 
    </div> 
    <div class="contentRightPart"> 
     <img src="../../Images/team.jpg" /> 
    </div> 
</div>

2）CSS：

.content 
{ 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 95%; 
    margin: 0; 
    padding: 0; 
} 

.contentLeftPart 
{ 
    float: left; 
    border: 3px solid black; 
    top: 0; 
    left: 0; 
    width: 250px; 
    height: 100%; 
    margin: 0; 
    padding: 0; 
    background: #d5f5e3; 
} 

.contentRightPart 
{ 
    float: left; 
    border: 3px solid blue; 
    top: 0; 
    left: 0; 
    width: auto; 
    height: 100%; 
    margin: 0; 
    padding: 0; 
}

我需要舒展身体t部分向右，直到屏幕结束，中间图像水平和垂直。

来源

2017-09-05 tesicg

来自哪里的@都是@你需要标记，因为它不是HTML，我们很多人都无法生成，所以无法帮助你。 – Rob

假设你的意思是垂直对齐：杀死float，设置绝对位置，设置一个明确的height，显示block（如果需要的话），声明底部的0。如果您不关心旧版浏览器的兼容性和支持，“flex”也是您可以探索的解决方案。 – UncaughtTypeError

这是MVC，在这个问题上并不重要。 – tesicg

您可以text-center类引导做

<div class="contentRightPart"> 
    <div class="text-center"> 
     <img src="../../Images/team.jpg" /> 
    </div> 
</div>

来源

2017-09-05 12:26:59

它不起作用。 – tesicg

使用

text-align: center;

在

.contentRightPart

还，删除width: auto;

来源

2017-09-05 12:29:10 Subha

它不起作用。 – tesicg

移除“width：auto”并尝试按原样保留“text-align：center”。 – Subha

它只是水平居中。如何垂直居中？ – tesicg

你可以做到这一点CSS使用以下代码： .contentRightPart { border：3px solid blue; top：0; left：0; 宽度：自动; 身高：100％; margin：0; 填充：0; text-align：center; float：none; }

来源

2017-09-05 12:38:14

它只是水平居中。如何垂直居中？ – tesicg

如何将图像放在正确的div中？

回答

相关问题