Border for homepage message (phpbb3)

View previous topic View next topic Go down

avatar
magicm00n
Member
Member
Forum Posts : 5
Member Since : 2012-03-16
View user profile

Postmagicm00n on 24/3/2012, 5:26 am

How can I add a border for the homepage message using CSS?
avatar
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30
View user profile

PostVanilla990 on 24/3/2012, 5:43 am

Could you provide a link to your forum please so I can take a further look?

I've just put a homepage message onto my person forum and it already has a border around it and it's one of the default themes so I want to check which theme you are using so I can specify how to add the border you are after Smile
avatar
magicm00n
Member
Member
Forum Posts : 5
Member Since : 2012-03-16
View user profile

Postmagicm00n on 24/3/2012, 6:42 am

Hi, I'm also using a default phpbb3 theme.

This is my test forum: testdummy.forum.st
avatar
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30
View user profile

PostVanilla990 on 24/3/2012, 8:02 am

Ok, try going into the Admin Panel and going to "Display > Pictures & Colors - Colors". Once in there, go to the CSS tab and paste in the following code.

Code:

.panel {
background-color: #ECF3F7;
color: #536482;
margin-bottom: 4px;
padding: 0 10px;
border:1px solid /*Enter colour code here */;
}
Make sure to replace the whole "/*Enter colour code here*/" with the hex color code like "#FFFFFF" for white.

You can also change the width of the border and the line type by replacing the "1px" for the width size and the "solid" for the line type. For more information on border css check out: http://www.w3schools.com/css/css_border.asp
avatar
magicm00n
Member
Member
Forum Posts : 5
Member Since : 2012-03-16
View user profile

Postmagicm00n on 24/3/2012, 8:27 am

Thanks^^!

Btw can you tell me how you know which part of the CSS to modify(ex: ".panel" is the homepage message) because I would like to add more borders for other parts of the forum.
avatar
Mike
Administrator
Forum Posts : 446
Member Since : 2011-10-28
View user profile http://www.codinghelp.org

PostMike on 24/3/2012, 9:15 am

Im guessing Vanilla990 has Google Chrome. If you have google Chrome, you can right click something that you'd like to edit, and click "Inspect Element". On the right side it will display all of the CSS that's related to it Smile
avatar
magicm00n
Member
Member
Forum Posts : 5
Member Since : 2012-03-16
View user profile

Postmagicm00n on 24/3/2012, 9:59 am

Owh okay, thanks!
avatar
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30
View user profile

PostVanilla990 on 24/3/2012, 11:17 am

Yeah, I use Google Chrome which is really useful for web development due to the right click "Inspect Element" function. I believe you can also do a similar thing in Firefox and also in Internet Explorer by using the Developers Console.
Sponsored content

PostSponsored content

View previous topic View next topic Back to top

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!


Create a new account

Log in

Already have an account? No problem, log in here.


Log in

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