WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You

WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You


You are not connected. Please login or register

WebArtz - The Web Design Forum » Web Designing & Coding » CSS (Cascading Style Sheets) » how to do post body like this for punbb?

View previous topic View next topic Go down  Message [Page 1 of 1]

1how to do post body like this for punbb? Empty how to do post body like this for punbb? Fri Dec 03, 2010 10:53 pm

sean

sean
Registered Member
Registered Member
phbb3 code :

Code:
.postbody {
background: transparent url(http://c.imagehost.org/0975/bub.png) no-repeat 640px 75px;
}

.postbody .content {
background: #FFF;
padding: 10px;
margin-right: 20px;
border: 1px solid blue;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}

how to do post body like this for punbb? P1

http://www.witalent.net

ankillien

ankillien
Administrator
Administrator
Hi,

This code would do that...

Code:
.entry-content > div{
border: 1px solid #888;
padding: 5px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}

.entry-content {
background: url(arrow image url here) no-repeat 0px 5px;
padding: 0 0 0 12px;
}

sean

sean
Registered Member
Registered Member
ok i will try this

http://www.witalent.net

sean

sean
Registered Member
Registered Member
have not work for me ;/ help please

http://www.witalent.net

ankillien

ankillien
Administrator
Administrator
What happens when you add the codes? Does anything change or nothing changes at all?

Make sure you add them in your CSS and not in templates.

sean

sean
Registered Member
Registered Member
ok well here is this link to my site take a look in the post area

www.witalent.net


this would be the post buble i mage i would like to add


how to do post body like this for punbb? Blog_b11

http://www.witalent.net

ankillien

ankillien
Administrator
Administrator
The bubble image should be small, about 20x20 px.

This code would add the bubble image...

Code:
.post-entry {
background: url(http://i33.servimg.com/u/f33/14/33/76/69/login10.png) no-repeat 590px 20px;
}

Replace the URL with your actual bubble image.

sean

sean
Registered Member
Registered Member
ok thanks will try this an let you know what happen

would love for you to be a member of my site ^_^

http://www.witalent.net

sean

sean
Registered Member
Registered Member
it add the image but not all of it is showing

don't know why :/

could you register an fix the code for me ?

look at what happen

http://www.witalent.net/wi-talent-gest-book-f108/hi-im-boo-boo-t3260.htm?tt=1#4305


oh crap never seen the size the buble pic should be XD

http://www.witalent.net

ankillien

ankillien
Administrator
Administrator
Avoid double posting, sean. This is your second reminder for double posting. Please use the edit button to add info to your post.

As I said, the bubble should be small, not the whole box, jost the bubble.

sean

sean
Registered Member
Registered Member
how is this now

http://www.witalent.net/members-introductions-f6/hello-future-slaves-t1806.htm?tt=1



now how to position the arrow up more than were i have it ?

code to edit:


Code:
.pun .postbody {
  background: transparent url(http://i63.servimg.com/u/f63/14/33/76/69/anew_b10.png) no-repeat right;
  }

please an thanks anki

http://www.witalent.net

ankillien

ankillien
Administrator
Administrator
That links redirects me to the log in page. I can't see the actual page as a guest.

To position the arrow, you can use pixels, instead of 'right'...

Code:
.postbody {
  background: transparent url(http://i63.servimg.com/u/f63/14/33/76/69/anew_b10.png) no-repeat 10px 20px;
  }

Change it as per your need.

sean

sean
Registered Member
Registered Member
ok this is solved now thanks anki for your help ^_^

http://www.witalent.net

Jophy

Jophy
Registered Member
Registered Member
Solved => Closed

http://www.socialtechforum.com/

Sponsored content


View previous topic View next topic Back to top  Message [Page 1 of 1]

WebArtz - The Web Design Forum » Web Designing & Coding » CSS (Cascading Style Sheets) » how to do post body like this for punbb?

Permissions in this forum:
You cannot reply to topics in this forum