CSS Search

Hide Slide Deck Border

Posted By Katie Pagano Aug 15, 2013 09:57 AM
Found In : Glossary

/** Hide Border of Slide Deck**/ .skin-slidedeck dl.slidedeck > dd ( border-right: 0px !important; background:none !important; ) .skin-slidedeck ( background: none repeat scroll 0 0 transparent !important; border: 0 none !important; box-shadow: none !important; ...

Add more padding to the community tabs

Posted By Admin System Jun 03, 2015 09:47 AM
Found In : Glossary

This increases the padding between the tab text and the edges of tab to 12px. It also darkens the text of the currently selected tab. /* ----- unselected tab padding ----- */ #CommunityTabs ul li a( padding-left:12px; padding-right:12px; ) /* ----- selected tab padding and text color----- ...

Change HLLandingControl title text size, color, etc...

Posted By Admin System Jun 03, 2015 09:44 AM
Found In : Glossary

Target the the HLLandingControl title text with the CSS rule below. Change px size and add other styles as you like. .HLLandingControl h2 ( font-size : 20px ; ) #CSS

Fix wrapping on Active Members Control

Posted By Andy Steggles Jun 14, 2013 10:53 AM
Found In : Glossary

.active-members .Details( width: 79%; padding-left: 60px; ) .edit-contact .editFunnelGrey ( background-repeat: repeat-x; background-color: #ccc; width: 395px; ) #CSS #Completed

Remove community title borders (top & bottom) from community pages

Posted By Justin Prevatte Apr 10, 2013 09:58 AM
Found In : Glossary

Removes these borders . /* ----- remove borders from community title ----- */ #PageTitleH1 ( border:none !important; ) I also made some other enhancements, so this is my final rule for this element: #PageTitleH1 ( border:none !important; color: #00529C; font-size: 25px; ...

Landing page borders for HTML content

Posted By Justin Prevatte Apr 23, 2013 11:29 AM
Found In : Glossary

Make sure your landing page HTML content has the CSS Class set to "HLLandingControl" and then use the following in your custom CSS. If you do want a border, just substitute 'none' with the px width that you want. .HLLandingControl div.HtmlContent( border:none; ) #CSS

Set the logo

Posted By Andy Steggles Apr 01, 2013 09:41 AM
Found In : Glossary

Sometimes it may be necessary to set the logo using CSS instead of using the image upload area. Here is some sample CSS to do it: #Logo ( background: url("http://higherlogicdownload.s3.amazonaws.com/SME/52ac56be-78ea-4f30-b6ba-02b23a32c612/UploadedImages/Template/sme-chapter-website-logo.png") no-repeat ...

Override inline styles > use !important

Posted By Justin Prevatte Apr 10, 2013 10:06 AM
Found In : Glossary

If you have ever been unable to change a specific style of an element because the style is inline, then use the !important modifier in your CSS. Example of inline style: <div id="inline" style="border-top:3px solid #f00;" >some text here</div> If you use this in you CSS the border ...

Hiding Elements

Posted By Jason Velazquez Apr 01, 2013 09:59 AM
Found In : Glossary

This quick fix will hide the elements like the Printer Friendly Icon or complete sections depending on what element you apply it to. #PrinterFriendly( display:none; ) You can also create a chain of classes and IDs you want to hide by separating with commas. IDs include Search box and, although ...

Library > List View > change "Attachment summary" text

Posted By Justin Prevatte Oct 15, 2013 02:46 PM
Found In : Glossary

Note: This is valid CSS, but I recommend against using this trick (:before and :after psudo-classes) too widely because search engines and people using screen readers will not be able to 'read' you new text. With great power comes great responsibility...dun dun duuuuuuun! Use this to hide current ...

Turn login text into a rollover button

Posted By Justin Prevatte Apr 15, 2013 09:11 AM
Found In : Glossary

This style rule is based on the code generated by cssbuttongenerator.com . Just update the generated style rule to target "#Welcome_LoginLink" as shown below. /* ------ LOG IN BUTTON ------ */ #Welcome_LoginLink( -moz-box-shadow:inset 0px 1px 0px 0px #00539c; -webkit-box-shadow:inset 0px ...

Repositioning Elements

Posted By Jason Velazquez Apr 01, 2013 10:02 AM
Found In : Glossary

At times a logo or welcome box might be a bit off in terms of where it is positioned. Here are some ways you can reposition elements or targeted images. The following is an example on how you can target the logo to move upward. #Logo( margin-top:-10px; ) To position an element to move right, ...

Discussion posts & replies font size

Posted By Justin Prevatte Apr 16, 2013 02:37 PM
Found In : Glossary

You can easily adjust the display size of all posts and replies in all discussions using the following rule in your theme's custom CSS. Just replace the '14' with whatever size you want. .digestViewerMessageDetails( font-size:14px; ) #CSS

Hide "Created by" field on glossary entries page

Posted By Justin Prevatte Apr 28, 2016 07:18 AM
Found In : Glossary

Update for new code base: /* ---------- Hide 'created by' and 'last updated by' field on glossary pages -------- */ [id*="ucGlossaryViewer"] .ByLine, [id*="glossaryListViewer"] .ByLine( display: none; ) / * ---------- Hide 'created by' field on glossary entries page -------- */ .glItem ...

Discussion post/thread > fix squished images

Posted By Justin Prevatte Jan 02, 2014 12:22 PM
Found In : Glossary

There seems to be a new rule in the standard HL CSS file that sets the max-width of all images within discussion posts to 400px. This can cause issues for two reasons: It only sets the width of the image so the inline height still applies, causing the image to be squished horizontally. ...

Discussion landing page > hide last activity

Posted By Justin Prevatte Apr 10, 2013 09:43 AM
Found In : Glossary

Screenshot of what this hides. .mainCommLastActivity ( display: none; ) #CSS

Announcement title size

Posted By Conor Sibley May 08, 2013 12:26 PM
Found In : Glossary

To adjust the size of the Announcement titles, use this rule in your CSS and adjust the px size to your liking. .HLAnnouncements .Content h3 ( font-size : 26px !important ; ) #CSS

Set the font size and type:

Posted By Andy Steggles Apr 01, 2013 09:29 AM
Found In : Glossary

body( font-size:14px; font-family: arial; ) #Need someone to add css to set the style font and sizes in the wysiwyg #CSS

Move the 'Edit Page' buttons out of the way

Posted By Justin Prevatte Jun 03, 2013 03:47 PM
Found In : Glossary

To move and rotate the edit page buttons out of the way like this , put this in your theme's CSS. It may need some adjusting based on what your site design it like. I've tested in IE8&9, FF, and Chrome. /* --- MOVE AND ROTATE THE SITE EDIT BUTTONS --- */ .AboveContentBarLeft ( height: 0; ...

Blog post font size

Posted By Justin Prevatte Apr 16, 2013 02:49 PM
Found In : Glossary

You can easily adjust the display size of blog posts on the View Blogs and Blog Viewer pages using the following rule in your theme's custom CSS. Just replace the '14' with whatever size you want. .blogComments( font-size:14px; ) #CSS

CSS Help and Resources