Remove round border

For support and discussion related to templates, themes, and imagesets in phpBB 3.1.
Suggested Hosts
Locked
abcd2014
Registered User
Posts: 74
Joined: Sun Feb 18, 2018 12:26 pm

Remove round border

Post by abcd2014 »

Items (i.e. header, nav_bar) of phpbb are always with round border, which looks nice.

However, I want a little difference:
How to adjust border's radius, or just change (remove) it to square?

Thanks

.
Last edited by Mick on Fri Mar 02, 2018 10:04 am, edited 1 time in total.
Reason: Moved from support.
User avatar
Mick
Support Team Member
Support Team Member
Posts: 26456
Joined: Fri Aug 29, 2008 9:49 am

Re: Remove round border

Post by Mick »

  • "The more connected we get the more alone we become" - Kyle Broflovski©
  • "The good news is hell is just the product of a morbid human imagination.
    The bad news is, whatever humans can imagine, they can usually create.
    " - Harmony Cobel
User avatar
PlanetStyles.net
Former Team Member
Posts: 4809
Joined: Wed Nov 04, 2009 11:16 pm
Location: Way up in the sky close to the stars
Name: Christian
Contact:

Re: Remove round border

Post by PlanetStyles.net »

Hello :)

Can I ask which you're using?

Thanks!
User avatar
Sniper_E
Registered User
Posts: 1126
Joined: Wed May 09, 2007 12:18 am
Location: Shreveport, Louisiana
Name: Ed Humphrey
Contact:

Re: Remove round border

Post by Sniper_E »

Your border-radius are set in the common.css file.

Code: Select all

.headerbar {
	margin-bottom: 4px;
	padding: 5px;
	border-radius: 7px;
}
All of them.

Borders are set in order of top-left, top-right, bottom-right and bottom-left.
border-radius: 7px; is the same as border-radius: 7px 7p 7px 7px; each point out a corner.

border-radius: 0 0 7px 7px; will be square on both top corners and round on both bottom corners.
border-radius: 7px 7px 0 0; will be round on both top corners and square on both bottom corners.
border-radius: 0 7px 0 7px; can you picture this one? Top-left and bottom-right square, top-right and bottom-left round.
You can make both left corners round and both right corners square if you want.

Have fun with that. :)
Image . -.. / .... ..- -- .--. .... .-. . -.--
No is NEVER an Option and NEVER is the only Option when it comes to Giving Up!

:!: Sniper_E Styles | phpbbmodders :!:
User avatar
Lumpy Burgertushie
Registered User
Posts: 69223
Joined: Mon May 02, 2005 3:11 am
Contact:

Re: Remove round border

Post by Lumpy Burgertushie »

or, if you want to remove all of the rounded corners for the whole style you can add this to the top of common.css:

Code: Select all

* {
  border-radius: 0 !important;
  -moz-border-radius: 0 !important;
}
robert
Premium phpBB 3.3 Styles by PlanetStyles.net

I am pleased to announce that I have completed the first item on my bucket list. I have the bucket.
Locked

Return to “[3.1.x] Styles Support & Discussion”