Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
    Posts
  • #1064577

    Hello

    Can I get small help here ? I am using menu on left side and because of that footer is not assigned to the bottom. Can you help me to put footer at the bottom of the page, reason why I need it is because when i dont have too much text like here footer is at the middle of the page.

    Thanks

    #1065683

    Hey ProSEO,

    That is something already discussed previously on our forums – please take a look
    https://kriesi.at/support/topic/sticky-footer-6/

    Best regards,
    Basilis

    #1065929

    Hi Basilis

    It doesnt work properly

    Menu on hover is hidden and footer is comming all way to the right side

    • This reply was modified 6 months, 1 week ago by  ProSEO.
    #1065944

    first of all you can avoid that menu problem on setting the z-index to 10.
    second do you realy want to show always your footer half height of the screen?
    or is it the fact you like to avoid on pages with less content that there is at the bottom a gap which has different color then content background?
    i would get that result on giving the #main a min-height of 100vh

    the linked page is from 2015 and for a layout with header on top.
    you have to think of that your header takes away 300px form 100% width – and on responsive case the header width is 27% so for footer width is 73% etc pp.
    So you had to calculate the max-width to 1010px ( on default it is 1310px) and the width as a difference etc. pp. –
    you see that will be complicate enough.
    By the way – you had to give a padding-bottom to #main to see all content under the footer.

    #1065965

    You are right I want to avoid to have footer at the middle of the site on pages with less content. So you are recommending to use #main min-height 100vh; ?

    Without changing footer css ?

    Thanks

    #1065983

    yes – and all your troubles gone-
    maybe a bit less than 100vh to have for those pages who will fit the socket in viewport

    #1065984

    by the way – all demos on enfold with sidebar header are non boxed one. Maybe this would be a nice idea for your page too
    The link is gone so i can not see now what happend but i would do it this way

    #1066010

    Thanks a lot for your help really appriciate it .

    #1066044

    Sorry for bothering you but still i have some issue

    Do you see it now ?

    #1066699

    Hi,

    It seems like you have following custom CSS code on your page

    .entry-content {
        min-height: 650px;
    }

    Please edit it and decrease the height

    Best regards,
    Yigit

    #1067093

    please remove this css rule the one Yigit mentioned !!!

    #1067118

    by the way – if you have custom separator and you like to have the icon in the middle – the distance defines the left and right distance – so with padding etc. you can insert 45% or something like this.

    (Purchase code hidden if logged out) -18-24-31.jpg”>(Purchase code hidden if logged out) -18-24-31.jpg” alt=”” />

    #1067353

    i think this will be enough code –
    lets see if this comes into conflict at some pages

    delete:

    .entry-content {
        min-height: 650px;
    }

    so try first this here in quick css:

    
    @media (min-width: 768px) {
    	#main {
    	    display: flex;
    	    height: 100vh;
    	    flex-direction: column;
    	    position: relative !important;
    	    overflow: visible !important;
    	}
    
    	.container_wrap {
    	    flex: 1 0 auto;
    	    width: 100% !important;
    	}
    
    	#footer, #socket{
    	  flex:none;
    	}
    }
    #1068190

    I think I’ve never written such an elegant solution to have the footer below – but it seems there was no interest in a good solution. – What a pity

    #1068293

    Hi Guenni007,

    It is an elegant solution! I hope future generations will appreciate it :)

    Thank you!

    Best regards,
    Victoria

    #1068510

    :lol :roflmao

    yes – flexbox model is a very powerful tool, which is rarely used properly.
    But only for that case Header Left or Right. And as he had only one container_wrap class

    #1100306

    Wow – you are a genius! Thank you very, very much for this solution! I will try something similar to get the social media icons in the side menu to the bottom.

    #1100308

    This a no-go, but I haven’t researched how to actually use “flex” yet:

    @media (min-width: 768px) {
    	#header_main, .av-logo-container {
    	    display: flex;
    	    height: 100vh;
    	    flex-direction: column;
    	    position: relative !important;
    	    overflow: visible !important;
    	}
    
    	.av-logo-container.inner-container {
    	    flex: 1 0 auto;
    	    width: 100% !important;
    	}
    
    	.av-sidebar-social-container{
    	  flex:none;
    	}
    }
    #1101185

    Hi,

    Unfortunately, it would require quite some time and customization of the theme to achieve this, so I am sorry to tell you that this is not covered by our support. However, if it’s really important for you to get this done, you can always hire a freelancer to do the job for you :)

    Best regards,
    Basilis

Viewing 19 posts - 1 through 19 (of 19 total)

You must be logged in to reply to this topic.