Question 165506 in Wordpress Question posted in
The official Wordpress documentation can be found here.

Is there a way to remove WordPress white border around container divs?

Please forgive the fact that I have no profile, I’m new to the online dev community. I am a designer by profession but I’ve recently started learning more front-end. I’m new to designing websites on WordPress and I think my question can be solved through code.

My coloured container divs containing text and images (see link to website) don’t extend all the way across the full width of the website. There’s that white border all on either side. How do I get rid of that white border? I know you can add do margin: 0; but I’ve tried adding that and going through all the diff settings of the wordpress editor and I’m not sure where to change this.

Any help would be much appreciated. Many thanks.

https://qaisrashahraz.com/macfest/

Tags:

2

Answers


  1. 0

    before you start styling css first thing you should do css resetting
    it is usually written at the top of code i.e

    • {padding:0;
      margin:0;
      } I think this will work for you and also browse more for CSS resetting here I have only mentioned a dummy code for css resetting.
    Login or Signup to reply.
  2. 0

    Hello Hajra and welcome.
    I went to to your website and it looks that the problem is related to the <body> tag that has a 20px margin all around.

    enter image description here

    You can check this by inspecting the webpage with your browser’s web tools.
    I added two css rules in the inspector just to show you what happens if you add left and right margin = 0 to the body tag (margin-left=0; margin-right=0).

    enter image description here

    This is just for showing you the result.
    In WordPress you can do that quite easily, in at least 2 ways:

    1. Depending on the theme you are using: usually there is a section in which you can add your custom css. Let me know what theme you are using and I can show you where to do that. In this case, the css will be: body { margin-left: 0px; margin-right: 0px;}. In case the margin is set somewhere, you might need to write this kind of code: body { margin-left: 0px !important; margin-right: 0px !important;}, although using !important is not a good practice, though it can sometimes solve problems fast.
    2. If you are using a page builder, there could be inspectors to define those margins. (Again, if you tell me what page builder you are using, I can tell you how to do that)
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search