Adjusting logo and title placement

1

Hi,

Is there a way to make both survey title and logo to display in the same line instead of the title comes underneath the log line (so that the survey title comes in the center of the page and the logo is right next to it, on the left or right corner)? Since the logo image I use is in a little square format, when I add it on the top, it leaves this big empty space next to the logo and doesn’t look that great.

 

Jim W (Moderator) answered
    2

    Depending on the aesthetics of the survey we are creating, we use different combinations of custom CSS code to get the logo and title to align.

    This is the simplest combination:

    .sg-header-image {
    display: inline-block !important;
    }
    .sg-title {
    display: inline-block !important;
    }

    In the second combination, we adjust the padding and margin setting of the logo and the title to get them to align:

    .sg-header-image {
    padding-left:15px;
    padding-top:15px;
    padding:right 30px;
    }
    .sg-header-image{
    float:left;
    margin:15px !important;
    }

    h1.sg-title {
    margin: 15px;
    margin-left: 50px !important;
    text-align: center;
    }

    In extreme case, we will open the CUSTOM HTML tab, comment out the template header image and the template title and install our own HTML:

    <table align=”center” border=”1″ bordercolor=”#150e44″ cellpadding=”0″ cellspacing=”0″ style=”margin:0px;” width=”100%”>
    <tbody style=”font-family:’Myriad Pro’, Helvetica, Arial, sans-serif”>
    <tr bgcolor=”#150e44″>
    <td width=”150px”><img border=”0px” height=”172″ src=”https://surveygizmolibrary.s3.amazonaws.com/library/321870/UBOlogoFINAL_150.jpg” width=”150″ /></td>
    <td valign=”bottom”>
    <h2 style=”color:#fff; text-align:right; margin:15px; font-size:300%;”>UBO Webinar Evaluation</h2>
    </td>
    </tr>
    </tbody>
    </table>

    We use the third method only in cases where we are certain that none of the respondents will be using mobile devices.

    Unfortunately there is no easy answer to your question.  You are going to have to play with the code until you find a setup that works for you.  Good luck. 

    Jim W (Moderator) edited answer
      ×

      Login

      Question stats

      • Active
      • Views2137 times
      • Answers1 answer
      • Followers2 followers