Title: How to split the sidebar
Last modified: August 22, 2016

---

# How to split the sidebar

 *  Resolved [victorvanwerkhooven](https://wordpress.org/support/users/victorvanwerkhooven/)
 * (@victorvanwerkhooven)
 * [11 years, 2 months ago](https://wordpress.org/support/topic/how-to-split-the-sidebar/)
 * This is probably either ridiculously easy or completely impossible. In the blog
   posts of the site I’m developing, I would like to split the upper widget “Geschatte
   Leestijd” from the rest, creating a seperate white field.
 * This is how it currently looks:
    [http://www.simonettekoven.nl/?p=108](http://www.simonettekoven.nl/?p=108)
   This is more or less how I want it to look: [http://i.imgur.com/PwWgCde.png](http://i.imgur.com/PwWgCde.png)
 * Any ideas?

Viewing 5 replies - 1 through 5 (of 5 total)

 *  Theme Author [Silkalns](https://wordpress.org/support/users/silkalns/)
 * (@silkalns)
 * [11 years, 2 months ago](https://wordpress.org/support/topic/how-to-split-the-sidebar/#post-5845570)
 * Here is how you can separate first widget from the rest. Add this code to Appearance
   >> Theme Options >> Other >> Custom CSS
 *     ```
       .well {
         background-color: transparent;
         padding: 0;
         border: none;
       }
   
       #secondary .widget {
         background-color: #fff;
         padding: 20px;
         border: 1px solid #DADADA;
         border: 0;
         margin-bottom: 0;
       }
       #secondary .widget:first-child {
           margin-bottom: 30px;
       }
       ```
   
 * Let me know if this helps.
 *  Thread Starter [victorvanwerkhooven](https://wordpress.org/support/users/victorvanwerkhooven/)
 * (@victorvanwerkhooven)
 * [11 years, 2 months ago](https://wordpress.org/support/topic/how-to-split-the-sidebar/#post-5845571)
 * Thank you so much, that does the trick indeed! At the risk of asking too much:
   is there any way to do the same thing for the first _two_ widgets? As in Widget1
   +Widget2 – seperation – Widget3+Widget4+etcetera
 *  Theme Author [Silkalns](https://wordpress.org/support/users/silkalns/)
 * (@silkalns)
 * [11 years, 2 months ago](https://wordpress.org/support/topic/how-to-split-the-sidebar/#post-5845572)
 * Then you can try to replace this part of my above give code:
 *     ```
       #secondary .widget:first-child {
           margin-bottom: 30px;
       }
       ```
   
 * With code like this:
 *     ```
       #secondary .widget:nth-child(3) {
           margin-bottom: 30px !important;
       }
       ```
   
 * Let me know if this helps.
 *  Thread Starter [victorvanwerkhooven](https://wordpress.org/support/users/victorvanwerkhooven/)
 * (@victorvanwerkhooven)
 * [11 years, 2 months ago](https://wordpress.org/support/topic/how-to-split-the-sidebar/#post-5845573)
 * You’ve been more than helpful so far, I appreciate it immensely. I’m very much
   in the trial-and-error phase of learning CSS, so would you mind explaining to
   me what your latest suggestion does? The #secondary .widget:first-child is pretty
   straightforward, but now we’re using variables and there’s suddenly a (3), and
   I can’t seem to grasp it entirely.
 *  Thread Starter [victorvanwerkhooven](https://wordpress.org/support/users/victorvanwerkhooven/)
 * (@victorvanwerkhooven)
 * [11 years, 2 months ago](https://wordpress.org/support/topic/how-to-split-the-sidebar/#post-5845575)
 * Never mind, I just suck at maths. I figured out how to manipulate the (3) to 
   do what I need it to do. Thanks again for your help.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘How to split the sidebar’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/sparkling/2.4.11/screenshot.png)
 * Sparkling
 * [Support Threads](https://wordpress.org/support/theme/sparkling/)
 * [Active Topics](https://wordpress.org/support/theme/sparkling/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/sparkling/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/sparkling/reviews/)

## Tags

 * [divide](https://wordpress.org/support/topic-tag/divide/)
 * [separate](https://wordpress.org/support/topic-tag/separate/)
 * [sidebar](https://wordpress.org/support/topic-tag/sidebar/)
 * [split](https://wordpress.org/support/topic-tag/split/)
 * [widget](https://wordpress.org/support/topic-tag/widget/)

 * 5 replies
 * 2 participants
 * Last reply from: [victorvanwerkhooven](https://wordpress.org/support/users/victorvanwerkhooven/)
 * Last activity: [11 years, 2 months ago](https://wordpress.org/support/topic/how-to-split-the-sidebar/#post-5845575)
 * Status: resolved