CSS Search

CSS Help and Resources

Remember to also utilize the Designer's Corner community for help and other CSS resources.

1 to 20 of 20 total
Posted By: Jason Velazquez Apr 1, 2013 6: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,...
Posted By: Justin Prevatte Apr 16, 2013 10:37 AM
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; )
Posted By: Justin Prevatte Apr 28, 2016 3: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...
Posted By: Justin Prevatte Jan 2, 2014 7:22 AM
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. ...
Posted By: Justin Prevatte Apr 10, 2013 5:43 AM
Found in :
Glossary
Screenshot of what this hides. .mainCommLastActivity ( display: none; )
Posted By: Admin System Jun 3, 2015 5: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----- */...
Posted By: Katie Pagano Aug 15, 2013 5: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; ...
Posted By: Admin System Jun 3, 2015 5: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 ; )
Posted By: Justin Prevatte May 8, 2013 8:26 AM
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 ; )
Posted By: Andy Steggles Apr 1, 2013 5: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
Posted By: Justin Prevatte Jun 3, 2013 11:47 AM
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; ...
Posted By: Justin Prevatte Apr 10, 2013 5: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; font-weight:...
Posted By: Justin Prevatte Apr 16, 2013 10:49 AM
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; )
Posted By: Andy Steggles Apr 1, 2013 5: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...
Posted By: Justin Prevatte Apr 10, 2013 6: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 will...
Posted By: Justin Prevatte Apr 23, 2013 7: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; )
Posted By: Andy Steggles Jun 14, 2013 6: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; )
Posted By: Justin Prevatte Apr 15, 2013 5: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 1px...
Posted By: Justin Prevatte Oct 15, 2013 10:46 AM
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...
Posted By: Jason Velazquez Apr 1, 2013 5:59 AM
Found in :
Glossary
This quick fixwill hide the elements like the Printer Friendly Icon or completesections 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...