Quote Appearance
3 posters
Page 1 of 1
Quote Appearance
How to get the quote to be like this:
Thank you!
Thank you!
angel_of_night- Forumember
- Posts : 565
Reputation : 10
Language : portuguese
Re: Quote Appearance
Hi
Try searching Marios94's topics. I believe he asked that same question there, if not, can you please link me to the site where you saw that?
Regards,
Pizza Boi
Try searching Marios94's topics. I believe he asked that same question there, if not, can you please link me to the site where you saw that?
Regards,
Pizza Boi
Pizza Boi- Hyperactive
- Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!
Re: Quote Appearance
Couldn't find anything from Marios.
The forum is this one: http://www.gokartbazaar.com/t589-new-forum-theme
The forum is this one: http://www.gokartbazaar.com/t589-new-forum-theme
angel_of_night- Forumember
- Posts : 565
Reputation : 10
Language : portuguese
Re: Quote Appearance
Hi
Well, they are using punBB, I believe. Anyway, I will not give out their full styles but please just revise this pattern:
Regards,
Pizza Boi
Well, they are using punBB, I believe. Anyway, I will not give out their full styles but please just revise this pattern:
- Code:
.postmain blockquote div cite {
background: url(IMG URL) 0% 0% repeat-x rgba(0, 0, 0, 0);
color: #Color;
display: block;
font-size: #px;
font-style: normal;
font-weight: 700;
height: #px;
left: #px;
position: absolute;
text-shadow: #Color #px #px;
top: -#px;
z-index: ###;
}
.postmain blockquote div cite::before {
background: url(IMG LINK) 0px 0px no-repeat rgba(0, 0, 0, 0);
content: '';
left: -#px;
position: absolute;
top: #px;
width: #px;
z-index: -#;
height: #px;
}
Regards,
Pizza Boi
Pizza Boi- Hyperactive
- Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!
Re: Quote Appearance
That code didn't do anything (yes I tried to add an image).
Also, won't I need a code for the left, center and right of it? Same way the vote bar works. Since it extends depending on the name.
You can see the quotes on my forum here: http://namelesscraft.co.uk/t1263-quote-test
Also, won't I need a code for the left, center and right of it? Same way the vote bar works. Since it extends depending on the name.
You can see the quotes on my forum here: http://namelesscraft.co.uk/t1263-quote-test
angel_of_night- Forumember
- Posts : 565
Reputation : 10
Language : portuguese
Re: Quote Appearance
Delete your CSS about quote then copy code below and paste to your CSS
- Code:
/*quote style*/
.postmain blockquote{
background:none;
border:0!important;
position:relative;
overflow:hidden;
min-height:35px!important;
margin:10px 0;
padding:11px 0 6px 10px;
font-size:14px;
line-height:18px;
color:#504536;
font-family:Georgia;
font-style:italic}
.postmain blockquote div{
margin-top:7px;
margin-left:6px;
-moz-border-radius:8px;
-khtml-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
border:solid 1px #5e87a6;
background-color:#D4FFE2 !important;
max-width:91%;
padding:15px 20px 10px 23px;
position:relative}
.postmain blockquote div:before{
content:'';
background:url(http://i58.servimg.com/u/f58/14/80/95/87/openq10.png) top left no-repeat transparent;
position:absolute;
width:16px;
height:16px;
top:15px;
left:3px}
.postmain blockquote div:after{
content:'';
position:absolute;
z-index:100;
background:url() top left no-repeat transparent;
width:16px;
height:16px;
right:4px;
bottom:4px}
/*Main header quote*/ .postmain blockquote div cite{
font-style:normal;
font-weight:700;
display:block;
font-size:13px;
color:#fff;
background:url(http://i.imgur.com/4Qrjnt2.png) top left repeat-x transparent;
height:19px;
position:absolute;
z-index:100;
top:-15px;
text-shadow:#000 1px 1px;
left:0}
.postmain blockquote div cite:before{
content:'';
position:absolute;
z-index:-1;
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qho10.png) no-repeat 0 0 transparent;
width:31px;
height:35px!important;
left:-13px;
top:0}
.postmain blockquote div cite:after{
content:'';
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhc10.png) no-repeat 0 0 transparent;
position:absolute;
right:-10px;
width:16px;
height:25px;
top:0}
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum