DIFFERENT ALIGNMENT FOR TEXT and LOGO CONTAINER

DIFFERENT ALIGNMENT FOR TEXT and LOGO CONTAINER

Support Forums Rosa – HTML Template DIFFERENT ALIGNMENT FOR TEXT and LOGO CONTAINER

This topic contains 3 replies, has 2 voices, and was last updated by Profile photo of creabox creabox 4 days, 7 hours ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #5668
    Profile photo of Arek
    Arek
    Participant

    Hi,
    First of all congratulations on this stunning design. It is what I have been looking for. My question is – I want to align the entire box containing Rosa logo, counter and social icons to the bottom. It looks great in the middle if you have landscapes on you pictures. In my case the elements I mentioned above are covering peoples eyes as I have people faces on my photos. Can you let me know where to change it? What line in css file is responsible for that?
    Many thanks

    #5669
    Profile photo of creabox
    creabox
    Keymaster

    Hi,

    First, you have to edit the file scripts.js in the folder js. You have to remove the function used to center the content. Delete the next code:

    /* ==============================================
    DIV's POSITION
    =============================================== */
    	
    var windowHeight = $(window).height();
    var homePageHeight = $('#home').height();
    
    if (windowHeight >= homePageHeight){
         $('#home').css("padding-top", (((windowHeight-homePageHeight)/2)-40));
         $('#home').css("padding-bottom", (((windowHeight-homePageHeight)/2)-40));
    }
    
    $(window).resize(function() {		
         var windowHeight = $(window).height();
         var homePageHeight = $('#home').height();
    
         if (windowHeight >= homePageHeight){
              $('#home').css("padding-top", ((windowHeight-homePageHeight)/2));
              $('#home').css("padding-bottom", ((windowHeight-homePageHeight)/2));
         }
    });

    Then, add the next code to the file style.css to center the content at the bottom of the page.

    #home{
         position: absolute;
         bottom: 20px;
         z-index:10;
         width: 100%;
    }

    You can modify the position changing the valur of the attribute bottom.

    Regards

    #5670
    Profile photo of Arek
    Arek
    Participant

    Many thanks :)

    #5672
    Profile photo of creabox
    creabox
    Keymaster

    Your welcome. If you need something more, contact me please.

    Anyway, I would be very thankful if you could rate the theme from your download page.

    Regards

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

You must be logged in to reply to this topic.