The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Footer alignment

Page 2 of 2 Previous  1, 2

View previous topic View next topic Go down

Solved Footer alignment

Post by skouliki on July 18th 2016, 4:22 pm

First topic message reminder :

hello
i put a simple footer to my forum ( http://iconskouliki.forumgreek.com/ punbb )my problem is that its centered only in the home page, when you navigate to other pages the alignment is not right

this is the html part in theoverall_footer end
Code:
.footercol {
  font-size: 11px;
  line-height: 25px;
  width: 25.0%;
margin: 0px 0px 0px 125px;
  padding: 25px 0 18px 0;
  vertical-align: top;
  display: inline-block;
  min-width: 125px;




Last edited by skouliki on August 9th 2016, 9:59 am; edited 1 time in total

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down


Solved Re: Footer alignment

Post by Van-Helsing on July 30th 2016, 10:56 pm

Hello @Skouliki,
Find this CSS code in your template:

Code:
<style>       
#footerCols {
                    width: 100%;
                    margin-left: 200px;
                    position: relative;
                }
                .cpy {
                    text-align: center;
                    text-decoration: none;
                    margin-left: -155px;
                    position: relative;
                }
                .Adaptor a {
                    color: #000 !important;
                    text-decoration: none !important;
                    text-align: center;
                    margin-left: -150px;
                    position: relative;
                }
        </style>

and replace it with the following code:

Code:
       
<style>
.footercol {
    font-size: 11px;
    line-height: 25px;
    width: 18.0%;
    margin: 0px 0px 0px 125px;
    padding: 15px 0 18px 0;
    vertical-align: top;
    display: inline-block;
    min-width: 125px;
    position: relative;
}
#footerCols {
                    width: 100%;
                    margin-left: 200px;
                    position: relative;
                }
                .cpy {
                    text-align: center;
                    text-decoration: none;
                    margin-left: -155px;
                    position: relative;
                }
                .Adaptor a {
                    color: #000 !important;
                    text-decoration: none !important;
                    text-align: center;
                    margin-left: -150px;
                    position: relative;
                }
        </style>


Then submit and publish your template viewtopic_body.

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on July 31st 2016, 8:08 am

hello @van-helsing

its not bad but its not the same centered footer as it is in the homepage and in forums
and its not centered in ipad also (going to the right)

every combination we do its ok but its not indentical

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Van-Helsing on July 31st 2016, 12:37 pm

Hello @Skouliki,
You can adjust on elements the margin-left to have the desired results. The Safari and other web browsers on iOS using different display port and it is appearing this problem. I was seeked help for this issue on iOS tech supports but this is apple's iOS problem on display port. Are you using the latest version of iOS (v9.3.3)?

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on July 31st 2016, 1:58 pm

yes iam using the lastest version but the problem is on laptop too not only on ipad
so my question is why FM, Keep on Blogging and your site the footer is ok ? if its ios problem

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Nekobake on July 31st 2016, 4:42 pm

why not just change the margin to auto?

Code:
.footercol {
    font-size: 11px;
    line-height: 25px;
    width: 25.0%;
    margin: auto;
    padding: 25px 0 18px 0;
    vertical-align: top;
    display: inline-block;
    min-width: 125px;
}

Nekobake
New Member

Posts : 16
Reputation : 1
Language : English - Greek
Location : in yo pants

http://nekonogomidampu.forummotion.com/

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on July 31st 2016, 4:57 pm

same result ..thank you @Nekobake
its ok but not indentical

the only thing that we didnt do is what Ace1 told us above (i tried but i couldnt figure out what to do)
to fix the wrapping in the topics to be around the footer like it is for the whole forum

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 5th 2016, 10:32 pm

Bump

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Luffy on August 5th 2016, 10:36 pm

Hello @skouliki,

Why didn't you add the footer in overall footer end template instead of having it in two templates?
Having it in overall footer end will show up in all pages. Wink






Luffy
Manager
Manager

Male Posts : 4236
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 5th 2016, 10:43 pm

So to understand you mean that i should delete it from overall end template and put it ..?

I did the same with my invision forum so i thought to follow the same steps

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Luffy on August 5th 2016, 10:58 pm

No @skouliki,

What i mean is that you should only have the footer in the overall footer end template. Nowhere else..
The overall footer end template should do the trick for all the pages and show up the same to every page. Wink






Luffy
Manager
Manager

Male Posts : 4236
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 5th 2016, 11:05 pm

Only there is it from the start but the problem is in the forum wrap
The templates for homepage and forums are all right wrapped but the template for topics is not ..thats what Ace1 found as the main problem for this

Edit ...i have also in the css yes i will delete it to see what wil happen
nop ... only in the overall @luffy

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Luffy on August 5th 2016, 11:32 pm

So now the entire footer is only in overall footer end?






Luffy
Manager
Manager

Male Posts : 4236
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 5th 2016, 11:43 pm

yes

i found this in the viewtopic and i delete it
Code:
<style>
.footercol {
  font-size: 11px;
  line-height: 25px;
  width: 25.0%;
  margin: auto;
  padding: 25px 0 18px 0;
  vertical-align: top;
  display: inline-block;
  min-width: 125px;
}
#footerCols {
  width: 100%;
  margin-left: 200px;
  position: relative;
  }
  .cpy {
  text-align: center;
  text-decoration: none;
  margin-left: -155px;
  position: relative;
  }
  .Adaptor a {
  color: #000 !important;
  text-decoration: none !important;
  text-align: center;
  margin-left: -150px;
  position: relative;
  }
  </style>

but the footer now is broken (only in the topics )

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Luffy on August 5th 2016, 11:50 pm

Okay so here's the normal CSS you should have in order to look everywhere the same:
Code:
#footerCols {
    width: 100%;
    display: inline-block;
    text-align: center;
}
.footercol {
    font-size: 11px;
    line-height: 25px;
    text-align: center;
    width: 20%;
    padding: 15px 0 18px 0;
    vertical-align: top;
    display: inline-block;
    min-width: 125px;
}

This will fix all the aligning. But in your template as far as i can see there's an extra column there:
http://prntscr.com/c252id






Luffy
Manager
Manager

Male Posts : 4236
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 6th 2016, 12:03 am

i think i delete the 4 column but with all the adaptor and footerCols we add it all these days iam not sure what to delete and what to keep

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Luffy on August 6th 2016, 12:06 am

Okay replace the codes i gave you above and remove the empty column and you should be fine! Wink






Luffy
Manager
Manager

Male Posts : 4236
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 6th 2016, 12:10 am

can the text be align to the left plz


when i text-align: left the footercol i just got the original problem ..footer same in homepage and forums different in topics Sad

not even now is the same look at the pictures



skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Van-Helsing on August 6th 2016, 12:20 am

Hello dear all,
@Skouliki as I checked you have add some parts/elements/codes from invision to punbb. Each forum version using some different elements for templates. In example when you add elements/codes/parts from different forum version templates you might produce those type of problems due the code parts must be transformed to the other forum version's templates and you must replace them correct in the correct section otherwise the codes are confusing and becomes more complicated to debug them.


Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 6th 2016, 12:22 am

@Van-Helsing wrote:Hello dear all,
@Skouliki as I checked you have add some parts/elements/codes from invision to punbb. Each forum version using some different elements for templates. In example when you add elements/codes/parts from different forum version templates you might produce those type of problems due the code parts must be transformed to the other forum version's templates and you must replace them correct in the correct section otherwise the codes are confusing and becomes more complicated to debug them.


hello ok i understand and you are right
so you suggest just to delete the footer and make a new one ? thats the best thing to do ?and to avoid all problems


skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Van-Helsing on August 6th 2016, 12:26 am

Yes I think this is the correct solution. I will make a new footer for your punbb forum this weekend to avoid all of these issues and I will posted here.

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 6th 2016, 12:28 am

thank you for your time do you need the exist one as a test ?

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by Van-Helsing on August 6th 2016, 1:21 am

Well @Skouliki, I found solution,

Replace the CSS elements #footerCols{rules} and .footercolP{} with the CSS codes below:

Code:

#footerCols {
    width: 100%;
    display: inline-block;
    text-align: center;
    margin-left: 175px;
    position: relative;
}
.footercol {
    font-size: 11px;
    line-height: 25px;
    text-align: left;
    width: 30%;
    padding: 15px 0 18px 0;
    vertical-align: top;
    display: inline-block;
    min-width: 125px;
}

The existing result must looks like this:



Are you using a unique overall_footer_end template with footer?Or you have kept the old one in viewtopic_body template?

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 6th 2016, 8:34 am

hello @Van-helsing

the homepage and forums looks like your picture perfect but same problem with the topics the footer is out of range , i left it for you to see it ..

yes the only template thats have css footer is the overall end ..i will be out for the day so here is hole css footer in case you need to see something

Code:
<div id="footerCols">
 
  <div class="footercol">
    <h3><h3><img src="https://cdn4.iconfinder.com/data/icons/48-bubbles/48/20.Photos-20.png" style="margin-bottom:0px"/>Icon Skouliki </h3>
    <ul>
        <li><a href="http://iconskouliki.forumgreek.com/t39-topic">Γενικοί Κανόνες του Forum</a></li>
      <li><a href="http://iconskouliki.forumgreek.com/t40-topic">Κανόνες Graphic Requests</a></li>
      <li><a href="http://iconskouliki.forumgreek.com/faq">Συχνές Ερωτήσεις</a></li>
        <li><a href="http://iconskouliki.forumgreek.com/h1-page">Πολιτική Απορρήτου</a></li>
        <li><a href="http://iconskouliki.forumgreek.com/contact">Επικοινωνήστε μαζί μας</a></li>
              </ul>
</div>
  <div class="footercol">
    <h3><img src="https://cdn4.iconfinder.com/data/icons/48-bubbles/48/05.Tag-20.png" style="margin-bottom:0px"/>ΧΡΗΣΙΜΑ LINKS</h3>
    <ul>
      <li><a href="http://iconskouliki.forumgreek.com/f2-forum">Συστηθείτε/Χρήσιμες Πληροφορίες</a></li>
      <li><a href="http://iconskouliki.forumgreek.com/f14-forum">Αιτήματα Σχεδίασης</a></li>
      <li><a href="http://iconskouliki.forumgreek.com/f21-forum">Mascots/Emoticons</a></li>
    <li><a href="http://iconskouliki.forumgreek.com/t186-topic">Πως μάθατε για το IconSkouliki ?</a></li>
    </ul>
      </div>
 
  <div class="footercol">
      <h3><img src="https://cdn4.iconfinder.com/data/icons/48-bubbles/48/33.Thumbs-Up-20.png" style="margin-bottom:0px"/>FOLLOW US</h3>
    <ul>
 
      <li><img src="https://cdn2.iconfinder.com/data/icons/social-18/512/Twitter-20.png" style="margin-bottom:0px"/><a href="https://twitter.com/IconSkouliki">Twitter</a></li>
    <li><img src="https://cdn2.iconfinder.com/data/icons/social-18/512/Facebook-20.png" style="margin-bottom:0px"/><a href="https://www.facebook.com/Iconskouliki/?ref=bookmarks">Facebook</a></li>
          <li><img src="https://cdn3.iconfinder.com/data/icons/free-social-icons/67/rss_circle_color-20.png" style="margin-bottom:0px"/><a href="http://iconskouliki.forumgreek.com/rss">RSS</a></li>
          </ul>
  </div>
 

 
 </div>
 
 
<div class="cpy"><a href="http://iconskouliki.forumgreek.com/"> Copyright 2016. Icon Skouliki</a>
  <br>
      </div>
<div class="Adaptor"><a href="http://best-design.forumgreek.com/">Best-Design Forum. All rights Reserved. </a><br>
  <br>
    <br>
  </div>
  </div>
</html>
<style>
.ol, ul {
    list-style: none;
}
 
#footerCols {
    width: 100%;
    display: inline-block;
    text-align: center;
    margin-left: 175px;
    position: relative;
}
.footercol {
    font-size: 11px;
    line-height: 25px;
    text-align: left;
    width: 30%;
    padding: 15px 0 18px 0;
    vertical-align: top;
    display: inline-block;
    min-width: 125px;
}
.bdfooter {
    background: #464c55;
    color: #000;
    height: 280px;
}
div.footercol a {
    color: black !important;
    font-size: 11px !important;
    text-decoration: none;
}
.footercol h3 {
    text-transform: uppercase;
}
.cpy {
    text-align: center;
    text-decoration: none;
}
.cpy a {
    color: #000 !important;
    text-decoration: none !important;
}
.Adaptor {
    text-align: center;
    text-decoration: none;
}
.Adaptor a {
    color: #000 !important;
    text-decoration: none !important;
}
</style>

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by skouliki on August 9th 2016, 9:59 am

hello all
i put the default view topic template and footer is fixed
thanks
problem fixed /solved

skouliki
Graphic Designer
Graphic Designer

Female Posts : 1607
Reputation : 253
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Solved Re: Footer alignment

Post by APE on August 9th 2016, 12:13 pm

Problem solved & topic archived.
Please read our forum rules: ESF General Rules




APE
Manager
Manager

Male Posts : 8601
Reputation : 748
Language : fluent in dork / mumbojumbo & English haha
Location : STUCK IN FORUMOTIONS SERVERS HELP ME !!!!!!

http://chatworld.forumotion.co.uk/

Back to top Go down

Page 2 of 2 Previous  1, 2

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum