Question

在这种情况下，如何在父div上显示子div？

<html>
<head>
<style>
.parent {
  position: absolute;
  overflow: hidden;
  z-index: 3;
  white-space: nowrap;
  text-decoration: inherit;
  text-align: center;
  color: inherit;
  left: 5px;
  top: 10px;
  width: 200px;
  height: 30px;
  background-color: red;
}
.child {
  position: relative;
  background-color: blue;
  width: 50px;
  height: 100px;
}
</style>
</head>
<body>
<div class="parent">
    <div class="child"></div>
</div>
</body>
</html>

https://sonata-project.org/bundles/admin/master/doc/reference/form_types.html#sonata-type-collection

非常重要的一刻，我无法更改父div的样式（此div已由Eclipse RAP生成，我无法对其进行更改）。

Answer 1

.parent {
position: relative;
/* overflow: hidden; */
z-index: 3;
white-space: nowrap;
text-decoration: inherit;
text-align: center;
color: inherit;
/* left: 5px; */
top: 10px;
width: 200px;
height: 30px;
background-color: red;}

.child {
position: absolute;
background-color: blue;
width: 50px;
height: 100px;
z-index: 100;}

你的意思是这样吗？

Answer 2

with out changing parents style is not actual way of doing... But it is possible by, Changing child style from position: relative to absolute
     .child {
            position: relative;
            background-color: blue;
            width: 50px;
            height: 100px;
            }

现在你的孩子div高于父div

Answer 3

答案 更改此

.child {  position: relative;  background-color: blue;  width: 50px;

身高：100px;}

或运行此代码段

＆＃13;

<html><head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - jsFiddle demo</title>
  
  
  
  
  
  <link rel="stylesheet" type="text/css" href="/css/result-light.css">
  
  <style type="text/css">
    .parent {
  position: absolute;
  z-index: 3;
  white-space: nowrap;
  text-decoration: inherit;
  text-align: center;
  color: inherit;
  left: 5px;
  top: 10px;
  width: 200px;
  height: 30px;
  background-color: red;
}
.child {
  position: relative;
  background-color: blue;
  width: 50px;
  height: 100px;
}
  </style>
  




</head>
<body>
  



<div class="parent">
	<div class="child"></div>
</div>


  





</body></html>

＆＃13;

如何在父DIV上显示子DIV（绝对，隐藏）？

3 个答案: