Title: Full-Width/screen
Last modified: August 21, 2016

---

# Full-Width/screen

 *  Resolved [snakiest](https://wordpress.org/support/users/snakiest/)
 * (@snakiest)
 * [12 years, 3 months ago](https://wordpress.org/support/topic/full-widthscreen/)
 * Hi
 * I have been using the theme to build a community for my students for some time
   now, and before long found myself very much engaged with site building). I really
   like the clean design of the theme, so thank you for that.
 * I was wondering if it is possible to make a full-screen template with it? I am
   not good at coding and stuff, and I had only a limited success with it. I am 
   using a plugin, Parallax Gravity, to have a full-screen slider (from one side
   to the other), but I was wondering if something like that was possible without
   a heavy plugin. Here is the page I have made with Parallax.
 * [http://engeduc.com/intro/home-landing-page/](http://engeduc.com/intro/home-landing-page/)
 * I am pretty happy with the result, but the plugin does not support setting the
   page as a home page. And again, I would like to keep the site as light as possible.
 * Thanks

Viewing 15 replies - 1 through 15 (of 17 total)

1 [2](https://wordpress.org/support/topic/full-widthscreen/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/full-widthscreen/page/2/?output_format=md)

 *  [batharoy](https://wordpress.org/support/users/batharoy/)
 * (@batharoy)
 * [12 years, 3 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612289)
 * The theme is based on a 940px wide 16 column system. You would need to convert
   the base grid css elements to a percentage based system most likely. Also the
   offset grids as-well.
 *  Thread Starter [snakiest](https://wordpress.org/support/users/snakiest/)
 * (@snakiest)
 * [12 years, 3 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612295)
 * double post, sorry,
 *  Thread Starter [snakiest](https://wordpress.org/support/users/snakiest/)
 * (@snakiest)
 * [12 years, 3 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612294)
 * And is it an easy task to accomplish for a non-techie person? And won’t it affect
   the whole page?
 *  [batharoy](https://wordpress.org/support/users/batharoy/)
 * (@batharoy)
 * [12 years, 3 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612306)
 * So you only want certain pages as full width and others as normal?
 *  Thread Starter [snakiest](https://wordpress.org/support/users/snakiest/)
 * (@snakiest)
 * [12 years, 3 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612307)
 * That is right. Well, ideally, I want to have only the slider full-screen. That
   Parallax plugin uses layers of pages, if I understand it right, so I can have
   full-screen and full-width side by side. Is that doable and if it is, what is
   the simplest way?
 * Thanks for helping me out!
 *  Thread Starter [snakiest](https://wordpress.org/support/users/snakiest/)
 * (@snakiest)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612435)
 * I am marking this topic as resolved. I have settled for the normal slider on 
   a regular page
 * [http://engeduc.com/](http://engeduc.com/)
 * No need to rack your brain over a simple design whim. Thanks, everyone.
 *  [kwiecu](https://wordpress.org/support/users/kwiecu/)
 * (@kwiecu)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612516)
 * I’d like to refresh the thread and the question. Would U mark it as not resolved
   as it has’t been answered yet?
 * > I was wondering if it is possible to make a full-screen template with it? I
   > am not good at coding and stuff, and I had only a limited success with it. 
   > I am using a plugin, Parallax Gravity, to have a full-screen slider (from one
   > side to the other), but I was wondering if something like that was possible
   > without a heavy plugin. Here is the page I have made with Parallax.
 *  Thread Starter [snakiest](https://wordpress.org/support/users/snakiest/)
 * (@snakiest)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612517)
 * Done. You’re right. It would be nice to know how to do it anyway.
 *  Theme Author [Fruitful Code](https://wordpress.org/support/users/fruitfulcode/)
 * (@fruitfulcode)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612521)
 * The theme is based on a 940px wide 16 column system. You would need to convert
   the base grid css elements to a percentage based system most likely. Also the
   offset grids as-well.
 * style.css from line 71
 *     ```
       /* Base Grid */
       .container .one.column,.container .one.columns {
           width:40px;
       }
       .container .two.columns {
           width:100px;
       }
       .container .three.columns {
           width:160px;
       }
       .container .four.columns {
           width:220px;
       }
       .container .five.columns {
           width:280px;
       }
       .container .six.columns {
           width:340px;
       }
       .container .seven.columns {
           width:400px;
       }
       .container .eight.columns {
           width:460px;
       }
       .container .nine.columns {
           width:520px;
       }
       .container .ten.columns {
           width:580px;
       }
       .container .eleven.columns {
           width:640px;
       }
       .container .twelve.columns {
           width:700px;
       }
       .container .thirteen.columns {
           width:760px;
       }
       .container .fourteen.columns {
           width:820px;
       }
       .container .fifteen.columns {
           width:880px;
       }
       .container .sixteen.columns {
           width:940px;
       }
       .container .one-third.column {
           width:300px;
       }
       .container .two-thirds.column {
           width:620px;
       }
       /* Offsets */
       .container .offset-by-one {
           padding-left:60px;
       }
       .container .offset-by-two {
           padding-left:120px;
       }
       .container .offset-by-three {
           padding-left:180px;
       }
       .container .offset-by-four {
           padding-left:240px;
       }
       .container .offset-by-five {
           padding-left:300px;
       }
       .container .offset-by-six {
           padding-left:360px;
       }
       .container .offset-by-seven {
           padding-left:420px;
       }
       .container .offset-by-eight {
           padding-left:480px;
       }
       .container .offset-by-nine {
           padding-left:540px;
       }
       .container .offset-by-ten {
           padding-left:600px;
       }
       .container .offset-by-eleven {
           padding-left:660px;
       }
       .container .offset-by-twelve {
           padding-left:720px;
       }
       .container .offset-by-thirteen {
           padding-left:780px;
       }
       .container .offset-by-fourteen {
           padding-left:840px;
       }
       .container .offset-by-fifteen {
           padding-left:900px;
       }
       /* #Tablet (Portrait)================================================== */
       /* Note:Design for a width of 768px */
       @media only screen and (min-width:768px) and (max-width:959px) {
           .container {
           width:768px;
       }
       .container .column,.container .columns {
           margin-left:10px;
           margin-right:10px;
       }
       .column.alpha,.columns.alpha {
           margin-left:0;
           margin-right:10px;
       }
       .column.omega,.columns.omega {
           margin-right:0;
           margin-left:10px;
       }
       .alpha.omega {
           margin-left:0;
           margin-right:0;
       }
       .container .one.column,.container .one.columns {
           width:28px;
       }
       .container .two.columns {
           width:76px;
       }
       .container .three.columns {
           width:124px;
       }
       .container .four.columns {
           width:172px;
       }
       .container .five.columns {
           width:220px;
       }
       .container .six.columns {
           width:268px;
       }
       .container .seven.columns {
           width:316px;
       }
       .container .eight.columns {
           width:364px;
       }
       .container .nine.columns {
           width:412px;
       }
       .container .ten.columns {
           width:460px;
       }
       .container .eleven.columns {
           width:508px;
       }
       .container .twelve.columns {
           width:556px;
       }
       .container .thirteen.columns {
           width:604px;
       }
       .container .fourteen.columns {
           width:652px;
       }
       .container .fifteen.columns {
           width:700px;
       }
       .container .sixteen.columns {
           width:748px;
       }
       .container .one-third.column {
           width:236px;
       }
       .container .two-thirds.column {
           width:492px;
       }
       /* Offsets */
       .container .offset-by-one {
           padding-left:48px;
       }
       .container .offset-by-two {
           padding-left:96px;
       }
       .container .offset-by-three {
           padding-left:144px;
       }
       .container .offset-by-four {
           padding-left:192px;
       }
       .container .offset-by-five {
           padding-left:240px;
       }
       .container .offset-by-six {
           padding-left:288px;
       }
       .container .offset-by-seven {
           padding-left:336px;
       }
       .container .offset-by-eight {
           padding-left:384px;
       }
       .container .offset-by-nine {
           padding-left:432px;
       }
       .container .offset-by-ten {
           padding-left:480px;
       }
       .container .offset-by-eleven {
           padding-left:528px;
       }
       .container .offset-by-twelve {
           padding-left:576px;
       }
       .container .offset-by-thirteen {
           padding-left:624px;
       }
       .container .offset-by-fourteen {
           padding-left:672px;
       }
       .container .offset-by-fifteen {
           padding-left:720px;
       }
       ```
   
 *  Thread Starter [snakiest](https://wordpress.org/support/users/snakiest/)
 * (@snakiest)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612522)
 * Thanks. I was reading more on this, and saw a tutorial for that for another theme.
   It proved to be too difficult for my skills. I’m sure with time I’d figure it
   out, but I don’t think it is worth it. Though adding a custom page template like
   that would really make the theme stand out. I’m saying this with a bit of fear
   that it would also mean making the theme commercial, which I wouldn’t want to
   happen.=)
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612523)
 * > I’m saying this with a bit of fear that it would also mean making the theme
   > commercial,
 * What do you mean by “commercial” here?
 *  Thread Starter [snakiest](https://wordpress.org/support/users/snakiest/)
 * (@snakiest)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612524)
 * I mean putting a price tag on it. =)
 *  [kwiecu](https://wordpress.org/support/users/kwiecu/)
 * (@kwiecu)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612525)
 * There is a big chance we will get full width template in the next version 1.3.3
   🙂
 * > Maybe we will add full width template in next theme version.
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612526)
 * [@kwiecu](https://wordpress.org/support/users/kwiecu/), btw sorry for deleting
   your comment on this thread. Accidental.
 *  [kwiecu](https://wordpress.org/support/users/kwiecu/)
 * (@kwiecu)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/full-widthscreen/#post-4612527)
 * It’s okay 🙂

Viewing 15 replies - 1 through 15 (of 17 total)

1 [2](https://wordpress.org/support/topic/full-widthscreen/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/full-widthscreen/page/2/?output_format=md)

The topic ‘Full-Width/screen’ is closed to new replies.

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

 * 17 replies
 * 6 participants
 * Last reply from: [bizwizkid](https://wordpress.org/support/users/bizwizkid/)
 * Last activity: [11 years, 3 months ago](https://wordpress.org/support/topic/full-widthscreen/page/2/#post-4612577)
 * Status: resolved