Adjust left and right borders in Template Structure
Autore: Percival R.
Visite 1541,
Followers 1,
Condiviso 0
I am trying to reduce the height of the top and bottom borders on my web page by going into the Template Structure and modifying the Height property. However, I am unable to adjust the left and right borders (highlighted) to match the new reduced height of the middle section. Regardless of the adjustments I use including using "Fixed Background", my top border ends up appearing uneven with the sides being higher than the middle.
Please let me know how I can adjust the height of the highlighted sections.
Thanks.
Postato il
Hello Percival,
The height of the 'middle section' will be determined by the height of your header:
The height of the margins on either side will be affected by the value you set for the header background:
Kind regards,
Paul
Search the WebSite X5 Help Center
Autore
Hi Paul,
Thanks for the advice. Your suggestion seems to work partially. When I reduce the size of the header and footer, the page looks fine on the main page, but the other pages seem to be a bit out of wack.
That's probably a straightforward cache issue. When I visit that same page in my own browser I see this:
So try clearing your browser cache. This is something you must do regularly when developing and testing for the web.
You can clear individual pages from the cache by holding down the CTRL key whilst pressing F5 to reload the page in the browser you are using to test.
Autore
Hi Paul,
Thanks for the feedback. After going online and seeing how crazy the header looked, I reverted everything back to the original settings. So, the website you were looking at is based on the original header/footer and body settings before I made any changes.
My only assumption is that I'm doing something terribly wrong. I tried using the following settings:
* 200 for the Header height
* 200 for the Header Background height
* 180 for the Footer height
* 180 for the Footer Background height
* 600 for the Page Contents height (I also tried 750 here without success)
However, these settings seem to cause the problems that I mentioned earlier.
I've tried very hard but sadly am unable to reproduce the problem, Percival, even using the exact same settings as above.
I still feel that cache might somehow be involved. If possible could you test briefly using a completely different browser, or alternatively in an incognito/private browsing mode?
It could be useful to see the issue at first hand, online. Are you able to upload a second project into a subfolder on your server, and provide a link to a test page where the source code could be inspected? This would greatly assist in working out exactly what is going on.
Autore
Hi Paul,
Thank you for your help.
I've created a temporary copy of my website using the link below:
https://www.red-regent-software.com/test_files/index.html
Percival, you accidentally left a narrow text box with the words "Red Regent Software" at the left side of your page. The text is LARGE and in WHITE, and because it is situated on a WHITE background, you don't see it. But I assure you it is there, and needs to be removed.
That text is for the Sticky Bar, Myron.
Percival, the issue appears to be the height of the header, which is set at 330px. Are you absolutely certain you have it set to 200px in Step 2 Template Structure, at desktop resolution?
Autore
Hi Paul,
Yes, I can confirm that I am using the setting 200px as you specified.
However, I was finally able to fix the problem, and I believe this is a bug in WebsiteX5. After making all the setting changes in the Template Structure, I needed to preview each page one at a time and then return to the Template Structure for each page and toggle one feature on and then off again (e.g., Fixed Background). Afterward, I needed to upload my website, but I needed to be careful to choose “Upload all Website files to the Internet” as opposed to modified files only.
After doing all the above and refreshing my browser cache, my web pages now look the way they should.
Thank you for the help with this issue.
PS: The website can now be reviewed in production.