change the position of the logo and the description

• 

  swisspps · Member · Jan 12, 2017 at 9:51 am

  • Copy link
  • Add topic to favorites

  hi, I would like to change the position of our logo in swisspps.com when we go through mobile or tablet; now logo is up and description down and I would like logo down and description up. Can somebody give me a css code to do it?
  Thanks

  The blog I need help with is: (visible only to logged in users)

• 

  aakashpatelsite · Member · Jan 12, 2017 at 11:02 am

  • Copy link

  Hi,
  I have seen your website coding through ‘inspect element’.
  You have used image tag before paragraph tag so in the responsive design it will display in order.
  But if you want description down logo and logo up in the smaller device then, use paragraph tag before the image tag. By using that your logo will be displayed below the description and for wider screen you have to use push and pull for exchange of columns.

  Thanks,
  Aakash Patel

• 

  swisspps · Member · Jan 12, 2017 at 11:35 am

  • Copy link

  Hi Aakash, thank you very much for answer me so fast, but I really don’t understand very clear what are you telling me, I am not an expert touching css code or html. where I have to go exactly to change logo position?
  sorry to disturb you

• 

  thesacredpath · Member · Jan 13, 2017 at 12:41 am

  • Copy link

  Hi @swissapps, add the following to your custom CSS which puts the site title above the logo on screens 1099px and narrower, which is when it moves to the right of the logo originally. This will not work on some older browsers, and in the case of Internet Explorer, it only works on IE11 and newer.

  @media screen and (max-width: 1099px) {
  	.site-branding {
  		display: flex;
  		flex-direction: column;
  	}
  	.site-title {
  		order: 1;
  		margin-bottom: 15px
  	}
  	.custom-logo-link {
  		order: 2;
  	}
  }

• 

  swisspps · Member · Jan 13, 2017 at 9:26 am

  • Copy link

  thank you so much thesacredpath.
  it works perfectly

• 

  thesacredpath · Member · Jan 16, 2017 at 8:55 pm

  • Copy link

  Hooray and you are welcome!