Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Nav Area Encroaching Banner Image


bbb-website
Go to solution Solved by rwp,

Question

Site URL: https://www.bodybybeth.co.uk/services

Hi, 

I have been creating a site and added some custom code to the nav area to make the logo sit flush with the banner. I also made it slightly bigger in depth as it looks better. I added code to the CSS area to do both of these things.

However, in making the navigation depth bigger, it has just started to crop into the banner image below it. I thought all the items on the site would have moved down with the navigation as I increased it, but all elements on the site stay the same position and the banner just grows and covers up what is there. As you can see it is cutting off the head in the picture, even though I put the focus selector circle right to the top when uploading it. Is there any way to move the banner down and the rest of the content under it as well and keep the navigation area the same height. I would like to try and keep the text in the banner sitting visually centre from the top and bottom of the banner also. 

Thanks in advance for any help.

 

Screenshot 2020-07-06 at 10.39.01.png

Screenshot 2020-07-06 at 10.39.32.png

Link to post
  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Posted Images

3 answers to this question

Recommended Posts

  • 0

Design -> Custom CSS

@media only screen and (max-width: 224px) {
  #page {
      margin-top: 25vw;
  }
}

@media only screen and (min-width: 225px) {
  #page {
      margin-top: 35vw;
  }
}

@media only screen and (min-width: 401px) {
  #page {
      margin-top: 40vw;
  }
}

@media only screen and (min-width: 501px) {
  #page {
      margin-top: 200px;
  }
}

#page .sections .page-section:first-child {
      padding-top: 0px !important;
}

 

Link to post
  • 0

One other question I have if you could help is, on the homepage for example in the banner I have added a button and set that button to be large. But in the areas directly under this, where it has the lady in the yellow top and the 'About Beth' text, the button size cannot be set, as this is an image card section. Is there any way to code it so the image card section buttons are the same size as the large buttons, as just now, the are just ever so slightly different.

Thanks!

Screenshot 2020-07-06 at 14.04.44.png

Screenshot 2020-07-06 at 14.04.52.png

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...