Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #926703

    I have a header widget, which I am not able to place smart next or between to my centered header and the right edge.
    Actually I would like to place it between the center and the right edge, but how does it work?

    I’m using follwing codes:

    #header .widget {
        clear: both;
        padding: 0px 0px 60px 0px;
        float: none;
        width: 186px;
        height: 28px;
        position: absolute;
        top: 10px;
        right: 15%;
        outline: 0;   
    
    @media screen and (max-width: 768px) {
        #header_main .widget {
         padding: 30 px;
         margin-right: 30 px;
    }
    }
    
    @media screen and (max-width: 990px) {
        #header_main .widget {
         margin-right: 30 px;
    }
    }

    biosaurus.ecounited.com

    #926938

    Hey ecounited,

    It’s not clear what exactly you are trying to do? I have provided a link in private content area please check the header widget position section. If you still have any issue please upload a screenshot/mockup to imgur.com and share the link here so we can help you better :)

    Best regards,
    Vinay

    #927355

    Hey here is a screenshot of my problem.

    header problem with right widget how to center between logo and edge

    Thanks for your support.

    • This reply was modified 6 years, 1 month ago by ecounited.
    #927517

    Hi,

    Your custom CSS will not allow you to position the widget next to logo as shown in the mockup.

    You are using

    #header .widget {
        clear: both;
        padding: 0px 0px 60px 0px;
        float: left;
        width: 186px;
        height: 28px;
        position: absolute;
        top: 10px;
        right: 15%; 
        outline: 0;
    }

    This will always place the widget 15% from the right edge of the header area.

    An even better solution would be to add an image next to logo and wih some CSS modifications, you will be able to achieve it.

    
    function add_logos($logo) {
      if(is_page(home)){
      
      $logo .= '<a class="first-logo" href="/"><img src="https://www.domain.com/logo-1.png"/></a>';
      }
      return $logo;
    }
    add_filter('avf_logo_final_output', 'add_logos');

    Best regards,
    Vinay

    • This reply was modified 6 years, 1 month ago by Vinay.
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.