Best Answer

Platform Subheader Height: CSS


Userlevel 4
Badge +1

Does anyone have any fun CSS or system settings I’m missing to control the height of this header across the platform (marked by red rectangle in the image)?

It really feels like a waste of real estate just for a page title.

 

 

icon

Best answer by Neil Patterson 24 March 2022, 12:59

View original

19 replies

Userlevel 6
Badge +2

I have CSS that will hide it completely if you want?  I found the same as you - complete waste of valuable space!

Userlevel 7
Badge +5

@Neil Patterson LOL - Yeah - pretty sure I eliminated it completely as well because I cannot seem to find anything similar to the screenshot.

 

Userlevel 7
Badge +5

@willingworth - Perhaps you could play with this a little…

Adjust as desired

Test

#page-title__wrapper {
height: 50px;
}

 

Userlevel 6
Badge +2

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Userlevel 4
Badge +1

Champions! Y’all are the real Docebo heroes. haha

Userlevel 6
Badge +2

 

Userlevel 7
Badge +2

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Userlevel 6
Badge +2

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

Userlevel 7
Badge +2

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

yes I have but is not loading. Is this in the correct position?

 

Userlevel 7
Badge +3

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

yes I have but is not loading. Is this in the correct position?

 

You are missing a } before the /* Custom links box - Horizontal line, so the code is being skipped over as it is  not set up right. The #customlinks should change color to become an id once you add that then save and see if it is resolved.

Userlevel 6
Badge +2

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

yes I have but is not loading. Is this in the correct position?

 

 

Strange - works perfectly on mine.  I don’t know if CSS works on priorities order?  I wonder if you have any CSS above that is amending the wrapper in anyway first?  Could you try pasting it at the top of your list, see if that works?  Otherwise i’m a little stumped i’m afraid

Userlevel 7
Badge +3

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

yes I have but is not loading. Is this in the correct position?

 

 

Strange - works perfectly on mine.  I don’t know if CSS works on priorities order?  I wonder if you have any CSS above that is amending the wrapper in anyway first?  Could you try pasting it at the top of your list, see if that works?  Otherwise i’m a little stumped i’m afraid

CSS does do priority order, but it is what is last done generally, but using the !important overides that order anyways, they are missing a closing bracket a few classes up which is probably causing the bottom not to be read.  A } before the /* Custom links box - Horizontal line, so the code is being skipped over as it is  not set up right. The #customlinks should change color to become an id once you add that then save and see if it is resolved.

Userlevel 6
Badge +2

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

yes I have but is not loading. Is this in the correct position?

 

 

Strange - works perfectly on mine.  I don’t know if CSS works on priorities order?  I wonder if you have any CSS above that is amending the wrapper in anyway first?  Could you try pasting it at the top of your list, see if that works?  Otherwise i’m a little stumped i’m afraid

CSS does do priority order, but it is what is last done generally, but using the !important overides that order anyways, they are missing a closing bracket a few classes up which is probably causing the bottom not to be read.  A } before the /* Custom links box - Horizontal line, so the code is being skipped over as it is  not set up right. The #customlinks should change color to become an id once you add that then save and see if it is resolved.

 

Good spot @Bfarkas!

Userlevel 7
Badge +2

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

yes I have but is not loading. Is this in the correct position?

 

 

Strange - works perfectly on mine.  I don’t know if CSS works on priorities order?  I wonder if you have any CSS above that is amending the wrapper in anyway first?  Could you try pasting it at the top of your list, see if that works?  Otherwise i’m a little stumped i’m afraid

Yes it worked. I just added this to the top. 

Thank you so much.🤗

Userlevel 7
Badge +3

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

yes I have but is not loading. Is this in the correct position?

 

 

Strange - works perfectly on mine.  I don’t know if CSS works on priorities order?  I wonder if you have any CSS above that is amending the wrapper in anyway first?  Could you try pasting it at the top of your list, see if that works?  Otherwise i’m a little stumped i’m afraid

Yes it worked. I just added this to the top. 

Thank you so much.🤗

You should fix the missing } otherwise everything you add to the bottom will not work. Moving it to the top just brought it above the issue, but you have a block in there not being used currently fyi because of the missing bracket. Moving to the top in this case was kind of like rebooting the computer, it worked  but didn’t fix the core issue :)

Userlevel 7
Badge +2

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

yes I have but is not loading. Is this in the correct position?

 

 

Strange - works perfectly on mine.  I don’t know if CSS works on priorities order?  I wonder if you have any CSS above that is amending the wrapper in anyway first?  Could you try pasting it at the top of your list, see if that works?  Otherwise i’m a little stumped i’m afraid

Yes it worked. I just added this to the top. 

Thank you so much.🤗

You should fix the missing } otherwise everything you add to the bottom will not work. Moving it to the top just brought it above the issue, but you have a block in there not being used currently fyi because of the missing bracket. Moving to the top in this case was kind of like rebooting the computer, it worked  but didn’t fix the core issue :)

Thank you, I deleted that css code as it was an old test. 

Userlevel 7
Badge +3

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Can someone help with how I can insert this into the patform. I have added this in the CSS, saved, and the top bar is still there

Hi @Salvo Have you done a reload of the platform after you saved?  Have you refreshed the page?

yes I have but is not loading. Is this in the correct position?

 

 

Strange - works perfectly on mine.  I don’t know if CSS works on priorities order?  I wonder if you have any CSS above that is amending the wrapper in anyway first?  Could you try pasting it at the top of your list, see if that works?  Otherwise i’m a little stumped i’m afraid

Yes it worked. I just added this to the top. 

Thank you so much.🤗

You should fix the missing } otherwise everything you add to the bottom will not work. Moving it to the top just brought it above the issue, but you have a block in there not being used currently fyi because of the missing bracket. Moving to the top in this case was kind of like rebooting the computer, it worked  but didn’t fix the core issue :)

Thank you, I deleted that css code as it was an old test. 

Nice! It’s good to get in the habit of having a format for the opening/closes so that you can easily scan for that kind of stuff. 

Userlevel 2
Badge

I used the following to remove it completely.

div#page-title__wrapper {display:none !important;}

Also used the following to remove the footer at the bottom f the page too :)

div.doc-layout-common-footer {display:none !important;}

 

Wow. The real MVP!! Thank you for sharing this. Just getting into HTML and CSS and this is a game changer! 

Userlevel 4
Badge

Putting the “div” in the CSS code is a bit odd (and likely “improper”). You’re already addressing an ID.

Proper CSS syntax is:
 

#page-title__wrapper {
display: none !important;
}

 

Reply