我只是学习CSS流体布局和响应式设计,我试图在布局中使用没有px值的所有百分比值.
到目前为止似乎有效,但在一个地方,我看到了一些我没想到的东西.我试图在两个垂直堆叠的div之间放置一个边距,这个div根据容器的高度而变化.当我垂直调整窗口大小时,我希望边距会改变,但如果你水平调整它,它也会增长,这是我不想要的.我错过了什么？
这是一个小提琴.感谢您的帮助.
我发现自己不得不经常使用JS,因为我认为只有CSS才能解决这个问题.
这是我想要做的一个示例情况:
div.outer { height:{Y}px }
div.inner { padding-top:{Y}px }
我真的不想特别设置外部div的高度,但我想要的是padding-top内部div 的属性匹配外部div的高度.我有什么关于CSS的东西吗？或者JS是常用的方法吗？
在jQuery中我会做这样的事情:
var y = $('div.outer').height();
$('div.inner').css('padding-top',y+'px');
虽然很少见,但是禁用JS的客户呢？
澄清:请注意,这不是"如何在CSS中执行此操作"问题.我知道目前,你不能在CSS中这样做.相反,更多的是关于其他类型的解决方案可以实现我所遵循的协调的问题.如果我只想计算初始交付的值,我可以用PHP编写PHP的PHP,但这不是我想要的.它更多的是协调两个元素,以便当一个元素发生变化时(由于窗口被调整大小或者设备被旋转,或者另一个元素通过AJAX引入,等等),另一个元素的样式也会改变以匹配它.