ROCKETTHEME IS CLOSING ON JUNE 30, 2025. As a thank-you to our community, enjoy 50% off all themes with the promo code THANKYOU before we shut down.
Read our Farewell Blog Post for more details.
Help me with a background image!
-
-
- Designhow
- Elite Rocketeer
- Posts: 1013
- Thanks: 0
-
This is a curved bottom shadow css for a module suffix I cant make it appear on the bottom.
Also how would I also place another image in the module beside this one..like an icon at the top?
70.32.73.244/joomla
.Sweatsolutions .rt-block{color: #417087;
border-style:solid;
border-radius:5px;
border-width:1px;
border-color:#C3C3C3;background: url( 70.32.73.244/joomla/images/icons/boxshadows.png ) 0 0 no-repeat; background-position: bottom; background-color: #ffffff; color: #000000;}This image is hidden for guests.
Please log in or register to see it. - Last Edit: 13 years 7 months ago by Designhow.
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29363
- Thanks: 956
- Volunteer
-
Sorry that just cant work. With that unhealthy sliced bg. dont try to use the shadow background on that element.
I would make more sense to just have an image with just that shodow with and not so much space arround it. That makes it unusable.
and use it in
#rt-sidebar-c > .Sweatsolutions {background: url(someurl) no-repeat 0 bottom;
padding-bottom: 50px;}
the 50px should match the height of the background pic (shadow).
-
-
-
- Designhow
- Elite Rocketeer
- Posts: 1013
- Thanks: 0
-
I am not sure I understand. Make the entire background an image with that shadow at the bottom, logo at the top?
I tried #rt-sidebar-c > .Sweatsolutions {background: url(someurl) no-repeat 0 bottom;
padding-bottom: 50px;} and it didn't work
hummm?
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29363
- Thanks: 956
- Volunteer
-
doh ... no someurl must be changed into the real path.
And at the end of your css you have buggy code wich destroys all code coming after that.
The shadow should look like this (see att.)
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29363
- Thanks: 956
- Volunteer
-
it just makes no sense to have a solid color and a background: url(
70.32.73.244/joomla/images/icons/boxshadows.png
on the same element.
-
-
-
- Designhow
- Elite Rocketeer
- Posts: 1013
- Thanks: 0
-
Henning,
I did use a real url in the code
I still can't get it to work! what is the buggy CSS line that is doing it?
see below
div.feature-desc{
width: 465px;}
a#gantry-totop {
box-shadow:0px 10px 8px ##0A2E4F;
border-radius:5px;
background-color:#BD7B3E;
color: #000000;
display: block;
text-align: center;
line-height: 25px;
}
#rt-logo {background: url(../images/logo.png) 0 0 no-repeat;width: 250px;height: 115px;display: block;}
#rt-header div.rt-container,
#rt-menu div.rt-container
{background-color: transparent;}
.rt-container
{background-color: transparent;}
/*
.rt-container .rt-grid-9 {background-color:#F5F5F5;}/*/
/*#rt-showcase div.rt-container
{box-shadow:0px 10px 8px #919191; border-radius:10px; background-color: #DCDCDC; color: #000000;}*/
#rt-breadcrumbs div.rt-container div.rt-block
{background-color: transparent;
Margin-top:0px;
Margin-bottom:0px;}
div.rokminievents { border-style:solid;color: #417087;
border-radius:5px;
border-width:1px;
border-color:#C3C3C3;
margin-bottom:20px; background: url( 70.32.73.244/joomla/images/icons/boxshadows.png ) 0 0 no-repeat; background-position: bottom; background-color: #ffffff; color: #000000; width:470px; height:300px;
}
.rokminievents h2.title {padding-left:40px;}
/*.shadow
-moz-box-shadow:inset 0 0 10px #000000;
-webkit-box-shadow:inset 0 0 10px #000000;
box-shadow:inset 0 0 10px #000000;
; border-radius:10px; background-color: #83ADBF; color: #000000; width:470px;
}*/
#rt-grid .rt-prefix div.rt-block
{box-shadow:4px 4px 4px #333333; border-radius:10px; background-color: #DCDCDC; color: #000000;}
.roknavmenu #rt-menu ul.menu li a, .menutop li.root .item, .menu-type-splitmenu .menutop li .item{
color: #000000;
background-color: #EA8E37;
-moz-box-shadow: 5px 5px 5px #4D4D4D;
-webkit-box-shadow: 5px 5px 5px #4D4D4D;
box-shadow: 5px 5px 5px #4D4D4D;
}
div#rt-bottom {background: #07325C; padding-top:23px;}
div#rt-footer, #rt-copyright {background: #417087;}
div.sectionnav{ font-size: 85%;}
.menutop li.active > .item {border-style:none;}
div.sectionnavhcp{ font-size: 85%;}
div.rsform {box-shadow:0px 10px 8px #4D4D4D; border-radius:10px; background-color: #000000; color: #417087;
-moz-border-radius: 5px;
border-radius: 12px;
-moz-box-shadow: 5px 5px 5px #B1B1B1;
-webkit-box-shadow: 5px 5px 5px #B1B1B1;
box-shadow: 5px 5px 5px #B1B1B1;
background: url( 70.32.73.244/joomla/images/banners/mail_open_edit.png ) 0 0 no-repeat;
background-color: #F0F0F0;}
div.rsform div.formCaption {
display: block;
float: left;
height: 12px;
padding: 12px;
width: 100%;
}
.News{box-shadow:0px 10px 8px #4D4D4D; border-radius:10px; background-color: #ffffff; color: #417087;
-moz-border-radius: 5px;
border-radius: 12px;
-moz-box-shadow: 5px 5px 5px #B1B1B1;
-webkit-box-shadow: 5px 5px 5px #B1B1B1;
box-shadow: 5px 5px 5px #B1B1B1;
background: url( 70.32.73.244/joomla/images/banners/newnews.png ) 0 0 no-repeat;
}
.jdonation{box-shadow:0px 10px 8px #ffffff; border-radius:10px; background-color: #ffffff; color: #417087;
-moz-border-radius: 5px;
border-radius: 12px;
-moz-box-shadow: 5px 5px 5px #B1B1B1;
-webkit-box-shadow: 5px 5px 5px #B1B1B1;
box-shadow: 5px 5px 5px #B1B1B1;
background: url( 70.32.73.244/joomla/images/banners/money.png ) 0 0 no-repeat;
}
.News h2.title{padding-left:69px;}
.jdonation h2.title{padding-left:100px;}
.know_sweat h2.title{padding-left:30px;}
.know_sweat{background: url( 70.32.73.244/joomla/images/icons/qestion.png ) 0 0 no-repeat;}
.tools h2.title{padding-left:30px;}
.tools{background: url( 70.32.73.244/joomla/images/icons/tools.png ) 0 0 no-repeat;}
.footer_3 h2.title{padding-left:30px;}
.footer_3{background: url( 70.32.73.244/joomla/images/icons/magnify.png ) 0 0 no-repeat;}
.Treatment_footer h2.title{padding-left:30px;}
.Treatment_footer{background: url( 70.32.73.244/joomla/images/icons/puzzle.png ) 0 0 no-repeat;}
new-menu #rt-menu ul.menu li a, .menutop li.root .item, .menu-type-splitmenu .menutop li .item{
color: #000000;}
.rokstories{width: 470px; Height: 300px; border-style:solid; border-radius:5px;
border-width:1px;border-color:#C3C3C3;
background: url( 70.32.73.244/joomla/images/banners/newnews.png ) 0 0 no-repeat;
background-color: #ffffff;
margin-bottom:30px;}
.rokstories .rokstories-layout2 .labels-title {background-color:#07325C}
.rokstories h2.title{padding-left:71px;
margin-top:23px}
.Sweatsolutions .rt-block h2.title{padding-left:73px;
margin-top:34px;}
.banner {color: #417087;
background-color: #ffffff;
border-style:solid;
border-radius:5px;
border-width:1px;
border-color:#C3C3C3;
margin-bottom:15px;}
.rt-block ..rt-article-bg {background-color: #ffffff;}
.Sweatsolutions .rt-block{color: #417087;
border-style:solid;
border-radius:5px;
border-width:1px;
border-color:#C3C3C3; background-color: #ffffff; color: #000000;}
#rt-sidebar-c .Sweatsolutions {background: url( 70.32.73.244/joomla/images/icons/boxshadows_small ) no-repeat 0 bottom ; padding-bottom: 50px;}
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29363
- Thanks: 956
- Volunteer
-
Please read carefully (the path was wrong and you missed a ">" ...)
Try this code
.Sweatsolutions .rt-block{color: #417087;
border-style:solid;border-radius:5px; border-width:1px;border-color:#C3C3C3; background-color:#ffffff; color:#000000;}
#rt-sidebar-c > .Sweatsolutions {background: url( 70.32.73.244/joomla/images/icons/boxshadows_small.png ) no-repeat 0 bottom ;
-
-
-
- Designhow
- Elite Rocketeer
- Posts: 1013
- Thanks: 0
-
I still can't get it!!! WTF....
.Sweatsolutions .rt-block{color: #417087;
border-style:solid;border-radius:5px; border-width:1px;border-color:#C3C3C3; background-color:#ffffff; color:#000000;}
#rt-sidebar-c > .Sweatsolutions {background: url( 70.32.73.244/joomla/images/icons/boxshadows_small.png ) no-repeat 0 bottom ;}
-
-
-
- Designhow
- Elite Rocketeer
- Posts: 1013
- Thanks: 0
-
I am using this url
70.32.73.244/joomla/images/icons/boxshadows_small.png
-
Time to create page: 0.091 seconds