Question: I have a div. Inside this div are 2 smaller divs. I want one of the smaller divs to have `overflow:visible`, and the other to have `overflow:hidden`. Can't figure out what selectors allow me to do this, I think I'm missing something super simple.

**edit** Sorry, let me rephrase that: I want the main div to have the style `overflow:visible` only applied to one of the child divs, while the main div also has the style `overflow:hidden` apply to the other. 

Example: 

<http://jsfiddle.net/3fQBt/>

```
<div id="body">
  <div id="visible">This div should be visible.</div>
  <div id="hidden">This div should be hidden.</div>
</div>

#body{
  width:300px;
  height:300px;
  margin:20px;
  position:relative;
  float:left;
  overflow:visible;
}

#visible{
  width:100%;
  height:100px;
  margin-left:-20px; //this should overflow visibly
  position:relative;
  float:left;
}

#hidden{
  width:100%;
  height:100px;
  margin-left:-20px; //this should be hidden
  position:relative;
  float:left;
}

```

Answer: 
something like this should get you going in the right direction.

```
<div id="body">
 <div id="visible">This div should overflow.</div>
 <div id="hidden-box">
  <div id="hidden">This div shouldn't.</div>
 </div>
</div>

#hidden-box {position:relative;overflow:hidden;height:100%;width:100%;}

```
You could do something like this, although it's pretty brittle, so not much use in the real world:

```
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style>

*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
body {margin: 0;}
#body{
    width:300px;
    height:300px;
    background-color:#f00;
    margin:20px;
    position:relative;
    overflow:hidden;
    border:solid 1px #000;
}

#visible{
    width:300px;
    height:100px;
    background-color:#0f0;
    position:fixed;
    left: 0;
}

#hidden{
    width:300px;
    height:100px;
    background-color:#00f;
    color:#fff;
    position:absolute;
    top: 100px;
    left: -20px;
}

</style>
</head>
<body>

<div id="body">
    <div id="visible">This div should overflow.</div>
    <div id="hidden">This div shouldn't.</div>
</div>

</body>
</html>

```