Jump to content

Archived

This topic is now archived and is closed to further replies.

hansonexperience

Design in footer

Recommended Posts

MattKeyes    0
MattKeyes

you just want the footer to be black?

 

You can add the following to css
 

.my-black-area {
  background-color: #000000;
  color: white;
}
 
and apply my-black-area (without the dot) to the class area of the edit footer section

Share this post


Link to post
Share on other sites
hansonexperience+    8
hansonexperience

MattKeyes thx will try this. I did not know it was that easy :-)

Share this post


Link to post
Share on other sites
Jake    74
Jake

Hi hansonexperience - Matt is correct, that's definitely one way to do it. The other way is to override the default footer CSS by adding the following custom code:

 

footer {background-color: #000000; color: #FFFFFF;}

 

You'll also probably want to make your footer links white as well so add:

 

footer a {color: #FFFFFF;}


Have you searched the forums yet or checked out the DMS user docs?

PageLines geek, blogging at MyUntangledLife.com

Share this post


Link to post
Share on other sites
hansonexperience+    8
hansonexperience

Jake ah great! I was just wondering how to do that :-)

Now I just have to style the code for the thumbs as they have an ugly white line around them. It is from the recent post extended widget. And it has its own css style like below. Where do I have to enter the black? 

 

 

.rpwe-block ul{
}
 
.rpwe-block li{
}
 
.rpwe-block a{
}
 
.rpwe-block h3{
}
 
.rpwe-thumb{
}
 
.rpwe-summary{
}
 
.rpwe-time{
}
 
.rpwe-alignleft{
}
 
.rpwe-alignright{
}
 
.rpwe-alignnone{
}
 
.rpwe-clearfix:before,
.rpwe-clearfix:after{
content: "";
display: table;
}
 
.rpwe-clearfix:after{
clear:both;
}
 
.rpwe-clearfix{
zoom: 1;
}
 
And how can I enter the hover effect to grey in both the left and right column and middle columns? And enter a titles?

Share this post


Link to post
Share on other sites
Jake    74
Jake

Hi hansonexperience - The white line you're seeing is the border around the recent post images so you'll probably just want to remove it completely. Try the following custom CSS:

 

.rpwe-thumb {border: none !important;}


Have you searched the forums yet or checked out the DMS user docs?

PageLines geek, blogging at MyUntangledLife.com

Share this post


Link to post
Share on other sites
hansonexperience+    8
hansonexperience

Jake Hi not that code for the line did not work out.

.rpwe-thumb.wp-post-image {

  border: none !important;
}
 
did the trick. Feels like doing magic :-) Great to do css styling
  • Like 1

Share this post


Link to post
Share on other sites
Jake    74
Jake

Sorry about that hansonexperience but you're a CSS ninja now and I'm glad to see you've got it working!


Have you searched the forums yet or checked out the DMS user docs?

PageLines geek, blogging at MyUntangledLife.com

Share this post


Link to post
Share on other sites
hansonexperience+    8
hansonexperience

Jake :-) Not quite ready. Also have to remove the border in the column to the right of this post images. The image comes from an uploaded image. Also in rpwe-thumb Any idea?

 

ANd how to change hove effect?

Share this post


Link to post
Share on other sites
MattKeyes    0
MattKeyes

Jake :-) Not quite ready. Also have to remove the border in the column to the right of this post images. The image comes from an uploaded image. Also in rpwe-thumb Any idea?

 

ANd how to change hove effect?

messing around with chrome web developer, I disabled the .rpwe_thumb attributes at line 943, then enable the the .rpwe_thumb attributes at line 879, minus the border and that removed the border from the "Some Pages" column

 

.rpwe-thumb {
  1. border1px solid #EEE!important;
  2. box-shadownone!important;
  3. margin2px 10px 2px 0;
  4. padding3px!important;

I think your running into a css specificity problem

Share this post


Link to post
Share on other sites
hansonexperience+    8
hansonexperience

MattKeyes I am not quite sure what you mean? Above code does not work with me.

Share this post


Link to post
Share on other sites

×