如何在不更改div的颜色的情况下更改此信息面板的颜色？

在此页面上，您将在左侧的侧面板中看到一个博客文章，其中包含缩略图，标记集和其他信息：http://www.elegantthemes.com/preview/TheStyle/2010/10/morbi-rutrum-interdum-justo/。如何在不更改div的颜色的情况下更改此信息面板的颜色？

我想要做的是在这个白色的div上创建一个黑色的矩形，这个黑色的矩形从白色div的左上角延伸到文本底部的左侧。

起初，我试着简单地创建一个像素宽的双色图像，并使用repeat-y来从上到下扩展“仿两列”布局。然而，这个div动态调整大小，所以在很多情况下，帖子中的黑色文本最终会跑到这个侧边栏中。

然后我试着以相同的方式使用相同的图像，但给白色div一个“位置：绝对”的特质。这导致右侧的侧边栏溢出到帖子内容上。

我想创建这个黑色的矩形来占据发布内容左侧的任何空格。

我继承了很多CSS，我不知道如何改变。任何建议将不胜感激。 `

我会在这里添加style.CSS文件，如果我可以找到某种方式这样做。这是我第一次在网站上。

来源

2011-06-28 user811491

你可能会展示你想要的图片吗？ –

很难破译你想要做什么，但看这有助于：

.post-content.info-panel { 
    background-color: black; 
    padding: 4px; 
    width: 28%; 
}

来源

2011-06-28 20:39:31 tybro0103

基本上，我试图把infopanel放到一个与白色div相同高度的黑色列中，在帖子内容的左边。 – user811491

展望CSS，它说，你说的一切都是自己的专区内：

<div class="info-panel">

就这样说，你只需要对你的CSS进行更改即可。你会做这样的事情：

.info-panel { 
    background-color: #000; 
}

但要记住的是，它看起来不错，你应该用填充和利润的信息面板和内容类别后发挥好。

我只是使它看起来更好，通过包括以下保持相同的总宽度：

.post-content { 
    background: url("images/entry-bottom-bg.png") repeat-x scroll left bottom transparent; 
    padding: 0 4% 30px 1%; 
} 

.info-panel { 
    background: none repeat scroll 0 0 #000000; 
    float: left; 
    margin-right: 1%; 
    padding: 2% 0 2% 2%; 
    width: 29%; 
}

最后两个代码的CSS代码片段都只是一些建议。我会做什么，如果我的解决方案为您。不代表你有，所以请不要这样对待它。它只是让该地区看起来很糟糕。

来源

2011-06-28 20:41:49 bdrelling

如何在不更改div的颜色的情况下更改此信息面板的颜色？

回答

相关问题