我的代码使高度依赖于两列。我想让它只依赖于左列，如果内容比左表格单元格更多，则使右列可滚动。
我确定我只是在思考它，但我似乎无法弄明白。
这是我的css：
<html>
<head>
<link href="style/tabcontent.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="row">
<div class="col">
Everyone turned toward me and gave me the death stare and I knew I had screwed up once again, they all walked in slow motion towards me saying the same familiar chant I had heard earlier, before anyone could reach me I awoke in a frantic sweaty rush in my bed.. My legs were no longer on fire and I felt slightly normal again. I noticed that my mom, a preacher, and several other family members were standing around me sobbing and chanting.. I said. "What's going on?" They informed me that I had been possessed by a spirit named Robert that liked to make people crazy by making there dreams seem similar to real life, only completely insane. They told me that I had been very lucky to be through such a traumatic experience and live to tell about it, without needing to be put in a psych ward. I turned to the preacher and said.
"I think were gonna need an oven and fast."
</div>
<div class="col2">
As I made my silent escape I heard grandma yell, "You forgot your cookies dear"
Little did she know I didn't give a s*** about those cookies. As I ran I thought about my previous life and how this whole day had been more interesting than my Whole entire life on earth had.. I began to ponder if this was karma kicking my a** for just sitting on the laptop all day typing short stories for little to no pay. When I decided to stop and catch my breath, I wiped the sweat from my face and looked up to see what else this new world had to offer.
Far off in the distance I could see a huge building, maybe a hotel or some sort of jail. I wasn't too sure.. but I marked that location off my list, the last thing I needed was to go to a jail and get killed by a bunch of mobsters.. I mean Hell my pants were already on Fire.
I decided to turn to my left and see what my next choice would be.
There were flying cantaloupes, rainbows and songs of happiness near by, I mean I was a little frightened by the flying fruit but I'll take this any day over Prison inmates.
I skipped closer and closer to the festivities and when I arrived I seen all my friends I had went to high school with there were holding hands and singing Kumbayah around the camp ice.. Yes It was a giant block of ice situated on three wood logs.. I felt much more comforted here than I did at my grandmas. I took a deep breath of relief and I thought Maybe, this day is getting better. I joined hands and with Germany and Tokyo and began to sing with everyone else, but as soon as I Belched out my voice changed to an annoying high pitched squeal.. Similar to ringing in your ears.
</div>
</body>
这是我的HTML：
(function () {
angular
.module('app')
.directive('repeatTimes', repeatTimes);
function repeatTimes ($window, $compile) {
return { link: link };
function link (scope, element, attrs) {
var times = scope.$eval(attrs.repeatTimes),
template = element.clone().removeAttr('repeat-times');
$window._(times).times(function (i) {
var _scope = angular.extend(scope.$new(), { '$index': i });
var html = $compile(template.clone())(_scope);
html.insertBefore(element);
});
element.remove();
}
}
})();
答案 0 :(得分：2)
$(document).ready(function() {
$(".col1, .col2").css("height", $(".col2").height());
});.container{
background:red;
overflow: auto;
width 80%;
padding: 10px 10px 10px 10px;
margin-left:auto;
margin right:auto;
}
.col1{
overflow: auto;
float: right;
width:70%;
background: blue;
}
.col2{
float: left;
width: 29%;
background: green;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class = "container">
<div class = "col1">
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
</div>
<div class = "col2"><p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p></div>
</div>
答案 1 :(得分：0)
这是你想要的吗？
.row {
margin-top: 10px;
position: relative;
display: table;
width: 99%;
display: flex;
padding: 20px;
box-sizing: border-box;
border: 0px;
}
.row div {
box-sizing: border-box;
display: block;
}
.col {
display: table-cell;
width: 72%;
position: relative;
vertical-align: middle;
color: #03274B;
padding: 5px;
overflow: hidden;
font-family: ‘Lucida Sans Unicode’, ‘Lucida Grande’, sans-serif;
}
.col2 {
display: table-cell;
width: 27%;
position: relative;
max-height: 150px;
color: #03274B;
background-color: #DCDCDC;
overflow-y: auto;
padding: 5px;
font-family: ‘Lucida Sans Unicode’, ‘Lucida Grande’, sans-serif;
}
button {
width: 100%;
background: rgba(0,0,0,0.1);
color: #4F4F4F;
border: 0px;
outline: 0px;
font-weight: bold;
padding: 5px;
margin-bottom: 2px;
}<div class='row'>
<div class='col'>
<button>Test1</button>
<button>Test2</button>
<button>Test3</button>
<button>Test4</button>
<button>Test5</button>
<button>Test6</button>
<button>Test7</button>
<button>Test8</button>
</div>
<div class='col2'>
<button>Test1</button>
<button>Test2</button>
<button>Test3</button>
<button>Test4</button>
<button>Test5</button>
<button>Test6</button>
<button>Test7</button>
<button>Test8</button>
</div>
</div>