Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #458810

    hi there,

    my customer wants a nearly 100% logo size to fill nearly the available space in header.
    it´s fine for now as long as i don’t switch the window size.
    i want the logo adopt to resize depending on window size automatically.
    for now i added to dust. css.

    #top .logo {
    width: 100%;
    height: 100%px;
    margin-top:-2px;
    margin-left:2%;
    margin-bottom:2%;
    }

    thanks for a quick hint.

    #459156

    Hey wienerpresswerk!

    I had a look at your site but I can’t see anything obviously wrong with it except that the logo looks pretty small on small window sizes. Could you try to explain your problem a bit further and maybe provide us with a screenshot of it as well?

    Regards,
    Rikard

    #466658

    hi there,

    Sorry if i´m confusing ;-)

    what I’m trying to reach you can see below in Priv. Section. a nearly 100% Logo centered.
    Menu items with different hoover status and positioning under the related color area in logo.
    Do you have any idea how to manage that?
    I would greatly appreciate your help!

    For now i have added to custom css:

    /*Change Hamburger colors:*/
    #advanced_menu_toggle, #advanced_menu_hide {
        background-color: #FFF;
        color: #545454;
        border-color: #393838;
    }
    
    /*Change dimensions of logo era:*/
    #top .logo {
    	width: 100%;
    	height: 200;
            margin:-top:5px;
           }
    
    /*Change  colors on hoover:*/
    .link5:hover {
    	background-color: #3E5D65;
    }
    .link4:hover {
    	background-color: #6D8B31;
    }
    .link3:hover {
    	background-color: #E69D2D;
    }
    .link2:hover {
    	background-color: #D25A17;
    }
    
    /*give menu items constant width:*/
    #menu-item-16594{
    width: 190px !important;
    }
    #menu-item-16505{
    width: 190px !important;
    }
    #menu-item-16506{
    width: 190px !important;
    }
    #menu-item-16503{
    width: 190px !important;
    }
    #menu-item-16507{
    width: 190px !important;
    }
    /*add some space below menu:*/
    .content{
    padding-top:25px;
    padding-bottom:25px;
    }
    #header_meta {
    min-height: 40px;
    }
    /*styling  custom menu on pages:*/
    .sub_menu {
    font-size: 13px;
    line-height: 30px;
    position: relative;
    top:20px;
    }
    

    best!

    #467374

    Hi!

    You should create another logo specifically for mobile device because the text in the original logo is a bit too small. Use this in the Quick CSS field to remove the default logo then add the mobile logo as background:

    @media only screen and (max-width: 767px) {
    .responsive #top .logo {
      background-image: url('http://efl.wienerpresswerk.at/wp-content/uploads/2015/06/mobile_logo.gif');
      background-size: 100%;
      background-repeat: no-repeat;
    }
    
    .logo img { display: none; }
    }

    Regards,
    Ismael

    #470064

    Hi Ismael,

    Thx for your response. That “logo replace” wont work for me. Any other idea?

    The main Prob for me ist the placement of any single menu item. That finally every menuitem is placed under a color bar from logo abobe.
    i.e. “LIZENZ” is placed under the green bar from logo above 786px.

    Thanks and best regards !

    #470271

    Hi!

    You can refer to this post and change logo on mobile – http://kriesi.at/documentation/enfold/change-logo-on-mobile/
    Please note that you will not be able to see the changes when you resize browser window. Please check on an actual device after making changes.

    Best regards,
    Yigit

    #471452

    Hi Yigit,

    That def. a feature request for Enfold – simply select a diff. mobile logo in Framework options.
    As long as other FW can handle that easily i.e. VC or others im surprised that esp. my genius from next corner down´t offer that
    without PHP editing.

    So anyway. maybe i´ve going on to rebuild the site later in web flow und other tools.

    For now i like to complete the project and need a quick idea for pavement of menu items as described above:

    what I’m trying to reach you can see below in Priv. Section. i have a nearly 100% width Logo – centered.
    Menu items with different hoover status and positioning under the related color area in logo.The main Prob for me ist the placement of any single menu item. That finally every menuitem is placed under a color bar from logo abobe.
    i.e. “LIZENZ” is placed under the green bar from logo above 786px.

    Thx for advice because i´m confused with all the diff. classes for now.

    #472214

    Hi!

    not sure if I understand what you mean and I think screenshots would help a lot (use imgur or dropbox). You link in private content does not work for me, because I see “Sorry, you do not have permission to access this page.”.

    Regards,
    Andy

    #472636

    Hi Andy,

    Should look like that

    View post on imgur.com

    Its about to set the right position for every Menu item below the refering color from logo above. as i understand i have to create a couple of @media classes to keep that all in place IF i found a solution to set it properly for desktops.

    THX!

    #473602

    Hey!

    use this code to control position of your menu items:

    li#menu-item-16594 {
    right: 20px;
    }
    li#menu-item-16707 {
    right: 25px;
    }
    li#menu-item-16503 {
    right: 30px;
    }
    li#menu-item-16841 {
    right: 23px;
    }
    

    Best regards,
    Andy

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.