• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 344
  • Last Modified:

wordpress - how to I add a nice curve to my page

Hi experts,

I have just finished my website www.freedomfighterclub.org. and had an issue with 2 white sidebars on the side of my homepage.

I was advised by a member of EE to add the code below to remove. This worked perfectly but now I cannot add a curve to my homepage page. My theme does have the function but it doesnt seem to function since the code below was added to my custom.css.

Is there any way I can add the curve in directly from one of the editor sheets. Please advise.  

#wrap { padding: 0!important; }
0
gpersand
Asked:
gpersand
  • 4
  • 3
  • 3
1 Solution
 
Ahmed HusseinCommented:
Change #wrap padding to:

padding: 10px 0px 20px;

Open in new window


and remove:

#wrap { padding: 0!important; }

Open in new window


it should work perfectly.

~AG
0
 
Ishaan RawatDesigner | Developer | ProgrammerCommented:
Well.. Please specify what curve are you talking about...

if you are talking about the border curves then add...

border-radius: 10px;

Open in new window

0
 
gpersandAuthor Commented:
I just did the above and its the same as before (not right).

Please take a look at my website again and you will see the white border around my main page. www.freedomfighterclub.org

I think it would be ok if the white border was BLACK.

Is there any way to change the colour?
0
Vote for the Most Valuable Expert

It’s time to recognize experts that go above and beyond with helpful solutions and engagement on site. Choose from the top experts in the Hall of Fame or on the right rail of your favorite topic page. Look for the blue “Nominate” button on their profile to vote.

 
Ahmed HusseinCommented:
this is not a border, it's your page, but it has a padding, which makes it look just like a border.
0
 
gpersandAuthor Commented:
Can I change the padding colour to black?
0
 
Ahmed HusseinCommented:
nope, it doesn't work that way, tell me exactly what you want to do, to make it easier.
0
 
Ishaan RawatDesigner | Developer | ProgrammerCommented:
GOT IT>>>>>>

Modify your #wrap css to...

#wrap {
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
box-shadow: 0px 1px 3px rgba(0,0,0,.2);
-moz-box-shadow: 0px 1px 3px rgba(0,0,0,.2);
-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.2);
margin: 30px auto;
border-left: 20px solid black;
border-right: 20px solid black;
border-bottom: 20px solid black;
}

Open in new window


This will help you get what you want...
0
 
Ishaan RawatDesigner | Developer | ProgrammerCommented:
and also add...
in the end of your stylesheet

 .entry {
border: 0px !important;
}

Open in new window

0
 
Ishaan RawatDesigner | Developer | ProgrammerCommented:
Now you might be having a border on the top...

This is because of the h1.page-title now if you remove that it will be removed from every single page with h1.page-title...

But if you want that to be removed.. then add this to your stylesheet....

h1.page-title {
border-bottom: 0px !important;
}

Open in new window

0
 
gpersandAuthor Commented:
Hey friend this worked perfectly. Thank you soo much@!!!
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

  • 4
  • 3
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now