Large Gap

For support and discussion related to templates, themes, and imagesets in phpBB 3.0.
Scam Warning
Jade23
Registered User
Posts: 71
Joined: Mon Sep 22, 2014 2:40 pm

Large Gap

Post by Jade23 » Wed Jan 27, 2016 3:57 am

http://imgur.com/RqXmxYN

Every time I add information to my sidebars, this huge gap between my forum and the top of the page body appears. I've tried to go into the commons.css > #forumlist ... to fix this but it's not working. Either I must not be looking in the right place or I've got to take some code out of somewhere to fix it but I'm not exactly sure where. I have no clue where I need to look to get this gap to go away. Could someone help me with this?

Website: http://standingtrials.com/index.php

User avatar
Elias
Registered User
Posts: 4613
Joined: Sat Feb 25, 2006 4:31 pm
Location: In the Water!
Name: Elias
Contact:

Re: Large Gap

Post by Elias » Wed Jan 27, 2016 5:14 am

In common.css what is your page-body margin set to?

Code: Select all

#page-body {
	margin: 4px 0;
	clear: both;
}
"Mystery creates wonder, and wonder is the basis of man's desire to understand." - Neil Armstrong
|Installing Extensions|Writing Extensions|Extension Validation Policy|

Jade23
Registered User
Posts: 71
Joined: Mon Sep 22, 2014 2:40 pm

Re: Large Gap

Post by Jade23 » Wed Jan 27, 2016 2:28 pm

It's set to what you posted.

Code: Select all

#page-body {
    margin: 4px 0;
    clear: both;

User avatar
pit-PL
Registered User
Posts: 3065
Joined: Sat Nov 21, 2009 12:24 pm

Re: Large Gap

Post by pit-PL » Wed Jan 27, 2016 7:41 pm

Try adding overflow: hidden; to #forumlist instead of using negative margin for #sidebar and #sidebarleft.

Jade23
Registered User
Posts: 71
Joined: Mon Sep 22, 2014 2:40 pm

Re: Large Gap

Post by Jade23 » Thu Jan 28, 2016 5:20 am

Alrighty, so I added that edit and took out the negative margins. The sidebars stay at the top but now the forum list is below the sidebars. Please take a look at the site.

http://standingtrials.com/index.php

I've tried to adjust the forumlist with negative margins again but no luck. The width of the sidebars and the forum list isn't the problem either. Not sure where all that space is coming from.


----Edit-----

Solved. Thank you for all your help. :)

User avatar
Elias
Registered User
Posts: 4613
Joined: Sat Feb 25, 2006 4:31 pm
Location: In the Water!
Name: Elias
Contact:

Re: Large Gap

Post by Elias » Thu Jan 28, 2016 6:53 am

What was the solution? :P
"Mystery creates wonder, and wonder is the basis of man's desire to understand." - Neil Armstrong
|Installing Extensions|Writing Extensions|Extension Validation Policy|

User avatar
Arty
Former Team Member
Posts: 16654
Joined: Wed Mar 06, 2002 2:36 pm
Name: Vjacheslav Trushkin
Contact:

Re: Large Gap

Post by Arty » Thu Jan 28, 2016 9:41 am

Best solution is to change structure. Wrap content in additional div and move it before sidebars then wrap it all in one additional div, so code would look like this:

Code: Select all

<div id="main-content">
    <div id="content-wrapper"> 
        <div id="content">content here </div>
    </div>
    <div id="sidebar-left"> left code </div>
    <div id="sidebar-right"> right code </div>
</div>
then add style like this:

Code: Select all

#main-content:before, #main-content:after { content: ''; display: table; clear: both; }
#sidebar-left { width: 236px; float: left; }
#sidebar-right { width: 236px; float: right; }
#content-wrapper { width: 100%; float: left; margin: 0 -236px; }
#content { padding: 0 246px; }
@media (max-width: 800px) {
    #content-wrapper { margin-right: 0; }
    #content { padding-right: 0; }
    #sidebar-right { float: none; margin: 0 auto; }
}
@media (max-width: 600px) {
   #content-wrapper { margin-left: 0; }
   #content { padding-left: 0; }
   #sidebar-left { float: none; margin: 0 auto; }
}

Jade23
Registered User
Posts: 71
Joined: Mon Sep 22, 2014 2:40 pm

Re: Large Gap

Post by Jade23 » Fri Apr 22, 2016 11:20 pm

Hey Arty,

Where exactly would I add this code into? For the style, I'm guessing it's common.css but what about the code above it?

Jade23
Registered User
Posts: 71
Joined: Mon Sep 22, 2014 2:40 pm

Re: Large Gap

Post by Jade23 » Sun Oct 02, 2016 10:51 am

I'd like to bump this for answers. I'm still having issues with this gap. It shows up in different heights from the header on different devices (iphone, ipad, computer, laptop).

---Edit----

I'm not sure how to code this suggestion into my forum and am nervous about fiddling with the code to make it work. Where do I copy/paste this to and what files do I need to edit?

User avatar
Christian 2.0
Former Team Member
Posts: 4442
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: Large Gap

Post by Christian 2.0 » Sun Oct 02, 2016 10:57 am

Hi Jade,

Interesting layout for sure. So that I can help you with this, I don't suppose you could let me know whether you coded the sidebars yourself or are you using a MOD?

I'd be happy to take a closer look if you're comfortable sending me a copy of your style files through private message :)
🚀 Premium phpBB Styles
Premium 3.2 Styles: Modern phpBB Style, NEW - Volare Material phpBB Style
Premium 3.2 Extensions: phpBB sidebar Extension
Custom work available on request

Jade23
Registered User
Posts: 71
Joined: Mon Sep 22, 2014 2:40 pm

Re: Large Gap

Post by Jade23 » Sun Oct 02, 2016 11:04 am

Hi there!

This is what I used ---> https://www.phpbb.com/support/docs/en/3 ... silver-se/

I'd be glad to provide you with my styles info if you can help me get rid of this funky gap! :D Just let me know what you need.

User avatar
Christian 2.0
Former Team Member
Posts: 4442
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: Large Gap

Post by Christian 2.0 » Sun Oct 02, 2016 11:08 am

Thanks Jade!

It may be a little tricky, but definitely not impossible to fix :)

Here's what I need you to do:

1) Browse to your forum installation
2) Browse to the madevo theme
3) .zip it up and download it
4) Attach it in a PM to me (or feel free to post here if you're comfortable with that)

I'll be a while digging around and seeing where the problem is, maybe an hour or two :)

C
🚀 Premium phpBB Styles
Premium 3.2 Styles: Modern phpBB Style, NEW - Volare Material phpBB Style
Premium 3.2 Extensions: phpBB sidebar Extension
Custom work available on request

Jade23
Registered User
Posts: 71
Joined: Mon Sep 22, 2014 2:40 pm

Re: Large Gap

Post by Jade23 » Sun Oct 02, 2016 11:10 am

Thanks much! I just downloaded it and will attach in PM now!

User avatar
Christian 2.0
Former Team Member
Posts: 4442
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: Large Gap

Post by Christian 2.0 » Sun Oct 02, 2016 1:38 pm

Thanks Jade, are you able to ping over the template and image files too?

My fault, I should have made this clearer. Thanks!
🚀 Premium phpBB Styles
Premium 3.2 Styles: Modern phpBB Style, NEW - Volare Material phpBB Style
Premium 3.2 Extensions: phpBB sidebar Extension
Custom work available on request

Jade23
Registered User
Posts: 71
Joined: Mon Sep 22, 2014 2:40 pm

Re: Large Gap

Post by Jade23 » Sun Oct 02, 2016 10:53 pm

Sure, sorry! Downloading and attaching to PM now.

Locked

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

Who is online

Users browsing this forum: No registered users and 11 guests