2017-10-14 41 views
0

目前我的显示器看起来像CSS内联

https://screenshots.firefox.com/kQs0Rz21PMhpDyDE/localhost

我想通过点击这个链接,我说明显示无格

增加教育链接是内嵌在教育的标签,但在落后

https://screenshots.firefox.com/tKtl1rcncgKSp23B/localhost

如果我使用保证金顶部,使内联它隐藏我的背后没有显示DIV

我应该怎么做

我的代码是

<div class= "row" id="mainContainer"> 
 
\t \t <div class="col-md-1 col-xs-4"> 
 
\t \t \t <label for="Education">Education</label> 
 
\t \t </div> 
 
\t \t <div class=class="col-md-8 col-xs-8 verticalLine" id="nestedFeilds" style=" margin-left: 10px ;float:left; display: none"> 
 
\t   <a href="" style="color: red;margin-left: auto; ">Delete Education</a> 
 
\t \t \t <input type="text" placeholder="School Name" class="form-control" id="School_Name" required="" name="School_Name[]"> 
 
\t \t \t |<br> 
 
\t \t \t <input type="text" placeholder="Feild of Study" class="form-control" id="feild_Name" required="" name="feild_Name[]"> 
 
\t \t \t <br> 
 
\t \t \t <input type="text" placeholder="Degree" class="form-control" id="Degree_Name" required="" name="Degree_Name[]"> 
 
\t \t \t <br> 
 
\t \t </div> 
 
\t </div> 
 
\t <div class= "row" id="2ndmainContainer"> 
 
\t <div class="col-md-1 col-xs-4"></div> 
 
\t <div class="col-md-8 col-xs-8 verticalLine" id="showhere" style=" margin-left: 10px ;float:left;"></div> 
 
\t \t <div style="margin-left: 120px; float:left;"><a id="addNew"> Add Education</a></div> 
 
\t </div> 
 
\t \t \t \t \t \t </form> 
 
\t \t \t \t </div> 
 
\t \t \t </div> 
 
\t \t \t <div class="col-xs-2"> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </div>

的div id为嵌套领域的完整内容将在DIV被追加与ID showhere

+0

亲切一些人可以帮我 –

+0

目前还不清楚你在问什么。你能否重申你的问题。 – kojow7

回答

0

添加float: left#mainContainer

<div class="row" id="mainContainer" style="float:left"> 
 
    <div class="col-md-1 col-xs-4"> 
 
    <label for="Education">Education</label> 
 
    </div> 
 
    <div class=class="col-md-8 col-xs-8 verticalLine" id="nestedFeilds" style=" margin-left: 10px ;float:left; display: none"> 
 
    <a href="" style="color: red;margin-left: auto; ">Delete Education</a> 
 
    <input type="text" placeholder="School Name" class="form-control" id="School_Name" required="" name="School_Name[]"> | 
 
    <br> 
 
    <input type="text" placeholder="Feild of Study" class="form-control" id="feild_Name" required="" name="feild_Name[]"> 
 
    <br> 
 
    <input type="text" placeholder="Degree" class="form-control" id="Degree_Name" required="" name="Degree_Name[]"> 
 
    <br> 
 
    </div> 
 
</div> 
 
<div class="row" id="2ndmainContainer"> 
 
    <div class="col-md-1 col-xs-4"></div> 
 
    <div class="col-md-8 col-xs-8 verticalLine" id="showhere" style=" margin-left: 10px ;float:left;"></div> 
 
    <div style="margin-left: 120px; float:left;"><a id="addNew"> Add Education</a></div> 
 
</div> 
 
</form> 
 
</div> 
 
</div> 
 
<div class="col-xs-2"> 
 
</div> 
 
</div> 
 
</div>

,我强烈建议您使用外部CSS样式表。

链接到外部样式表:

<head> 
    <link rel="stylesheet" type="text/css" href="theme.css"> 
</head> 

W3schools

+0

不,先生它仍然不是内联 –

+0

https://screenshots.firefox.com/exxQo64v160SVPks/localhost –

+0

嗯,它在这里工作。你能发布一个链接到你的网站? –