Joomla Templates Club 406,261 posts

[Tech-xml Friend Tech-xmlJoin date: October 2010Posts: 765Downloads:39Uploads:140 Thanks: 106 Thanked: 5 times in 2 posts]

#170643

Help me with this CSS

Can someone pass me the css applied to complete this section:
http://templates.joomlart.com/ja_events/index.php?option=com_content&view=category&layout=blog&id=35&Itemid=56

I need to use the same style in another template. I tried to do here, but it does not work, perhaps because the framework T3.

I need only this block:

---

Attachments:

1. 

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#424378

Hi,
I don’t understand what you mean clearly. Could you explain more details? Could you give me a snapshot with your annotation?

[Tech-xml Friend Tech-xmlJoin date: October 2010Posts: 765Downloads:39Uploads:140 Thanks: 106 Thanked: 5 times in 2 posts]

#424382

can send me the code comlete the CSS used on this page?
http://templates.joomlart.com/ja_eve…d=35&Itemid=56

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#424445

It’s here:

.ja-speaker-info ul li {
background: url(../images/bullet4.gif) no-repeat 0px 6px;
padding-left: 10px;
}
.ja-speaker-info ul {
margin: 0;
padding: 0;
list-style: none;
}
If you apply the code and it doesn’t work, you give me a link to your page. I will do it for you

[Tech-xml Friend Tech-xmlJoin date: October 2010Posts: 765Downloads:39Uploads:140 Thanks: 106 Thanked: 5 times in 2 posts]

#424473

Missed the CSS for the image.

What does the edge, cornea and the caption. This is what I need most.

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#424602

ok,
In /templates/ja_events/css/typo.css (start line #831)


/* Images Styling ---*/
.img-style-wrap img {
padding: 5px;
background: #fff;
border: 1px solid #e2e2e2;
}

.img-style-wrap.style5 img,
.img-style-wrap.style7 img,
.img-style-wrap.style8 img {
padding: 0;
border: 0;
float: none;
}

.img-style-wrap.style1 {
background: url(../images/img-shadow-br.png) no-repeat right bottom;
padding-bottom: 3px;
padding-right: 3px;
}

.img-style-wrap.style2 {
background: url(../images/img-shadow-br2.png) no-repeat center bottom;
padding-bottom: 7px;
}

.img-style-wrap.style3 {
background: url(../images/img-shadow-br3.png) no-repeat center bottom;
padding-bottom: 6px;
}

.img-style-wrap.style4 {
background: url(../images/img-shadow-br.png) no-repeat right bottom;
padding-bottom: 3px;
padding-right: 3px;
}

.img-style-wrap.style7 {
width: 203px;
text-align: center;
}

.img-style-wrap.style8 {
width: 192px;
text-align: center;
}

.img-style-wrap {
position: relative;
}

.img-style-wrap span.corner {
background: url(../images/img-shadow-right.png) no-repeat right top;
padding: 0;
border: none;
position: absolute;
top: 0;
right: 0;
width: 23px;
height: 23px;
}

.img-style-wrap span.caption {
position: absolute;
line-height: 40px;
}

.img-style-wrap.style4 span.caption {
bottom: 4px;
left: 1px;
background: #fff;
width: 168px;
}

.img-style-wrap.style6 span.caption {
bottom: 4px;
left: 1px;
background: #fff;
width: 168px;
}

.img-style-wrap.style5 span.caption {
bottom: 0;
left: 0;
background: url(../images/caption2.png) no-repeat left bottom;
width: 175px;
color: #fff;
height: 44px;
line-height: 55px;
}

.img-style-wrap.style6 span.caption {
bottom: 4px;
left: 6px;
background: url(../images/caption3.png);
width: 163px;
color: #fff;
line-height: 40px;
}

.img-style-wrap.style7 span.caption {
bottom: 0;
left: 0;
background: url(../images/caption4.png) no-repeat left bottom;
width: 203px;
color: #fff;
line-height: 40px;
}

.img-style-wrap.style8 span.caption {
bottom: 0;
left: 0;
background: url(../images/caption5.png) no-repeat left bottom;
width: 192px;
color: #fff;
line-height: 40px;
}

.img-style-wrap.style4 span.corner,
.img-style-wrap.style1 span.corner { right: 3px; }

.img-style-wrap.style5 span.corner {
background: url(../images/img-shadow-corner.png) no-repeat right top;
right: 0;
}

.img-style-wrap span.zoom1 {
background: url(../images/zoom1.png) no-repeat right top;
position: absolute;
left: 38%;
top: 38%;
width: 44px;
height: 44px;
cursor: pointer;
}

.img-style-wrap span.zoom2 {
background: url(../images/zoom2.png) no-repeat right top;
position: absolute;
left: 43%;
top: 43%;
width: 29px;
height: 29px;
cursor: pointer;
}

.img-style-wrap span.zoom3 {
background: url(../images/zoom3.png) no-repeat right top;
position: absolute;
left: 5px;
top: 5px;
width: 17px;
height: 17px;
cursor: pointer;
}
In templates/ja_events/css/template.css (start line #291)


/*Inline images ---*/
p.img_caption { color: #999; text-transform: uppercase; }

img.img-border {
background: #FFFFFF;
border: 1px solid #E2E2E2;
padding: 5px;
}

.img-style-wrap.style3.img-border { width: auto; }

.img-style-wrap.style3.img-border span.corner { right: 0; }

.img-style-wrap.style3.img-border span.caption {
bottom: 12px;
left: 0;
display: block;
margin: 0 6px;
background: url(../images/caption3.png);
color: #fff;
padding: 0 15px;
width: 140px;
line-height: 30px;
text-transform: uppercase;
font-weight: bold;
}

.img-border.left { margin: 15px 15px 0 0; }

.img-style-wrap.left { margin: 0 15px 0 0; }

.img-border.right { margin: 15px 0 0 15px; }

.img-style-wrap.right { margin: 0 0 0 15px; }

[Author]

Posts