Tag Info

Hot answers tagged

12

Does SharePoint 2013 have support for responsive design or do you have to create it from stratch? No, there is no built in out of the box support for responsive design in SharePoint 2013. Responsive design is different from Mobile friendly design, and as such I think it's best to do your page layout and not rely on a framework. Others feel different, ...


10

you can use sprite cow to generate your css http://www.spritecow.com/


8

I know you asked for 2013 but I'm leaving the 2010 one here too in case anyone go crazy like you did. 2010 When any ribbon tab is open (other than the 'browse' one) it forces a 135px height on its container, which is a sibling of the #s4-workspace container, see where I am going? #s4-ribbonrow[style='height: 135px;'] ~ #s4-workspace #s4-leftpanel { ...


4

As far as I'm aware, the crawler won't 'run' the javascript on the generated page, therefore this technique probably won't actually work. Can't you add a noindex class to the container div of the nav control on the masterpage?


4

Based on Zimmergren's blogpost regarding new delegate controls in SP 2013: Create a module with the following in the Elements file <?xml version="1.0" encoding="utf-8"?> <Elements xmlns="http://schemas.microsoft.com/sharepoint/"> <!-- DelegateControl reference to the SuiteLinksDelegate Delegate Control --> <Control ...


4

If you don't apply any particular style to a table inserted in a CEWP, it'll get applied the class ms-rteTable-default. So, instead of what you have done, you can override -in your custom css file- that class: .ms-rteTable-default{ -ms-name:"Tabell - test"; border:1px solid $borderColor; // sass syntax margin: 8px 0; width:98%; } Just make ...


4

To hide it during Print, you can use the following CSS: @media print { div#suiteBar { display: none; } }


4

Use SharePoint Designer and follow these steps: Connect to SharePoint site in SharePoint designer. On the left pane click All Files. Then on the list select "Style Library". Select the CSS file you want to edit and then click "Edit file". If check out is required it will do it for you after your confirmation. Make your changes, save the file, and don't ...


4

The ID will remain the same on your single SharePoint-Environment, but it can be different on other site collections. The name and the zz are always the same, but the number will change, so you have to build your css with wildcards, e.g.: div[id^=zz][id$=_TopNavigationMenu] { display: none; }


3

If you don't want to modify the master page, then the alternative is to go into Site Settings and click on Master Page in the look and feel section and in there add your custom css file into the Alternate CSS URL section.


3

In SharePoint, the main viewport of the webpage is not the html or body elements. Instead, they use div#s4-workspace, which is meant to take up 100% of the height and width (minus the ribbon). Try adding your overflow-y to this element: #s4-workspace { overflow-y: scroll; }


3

In order to overcome the tedium that ensues at the onset of every SharePoint 2010 design project, I have created a simple snippet of CSS that is intended to reset the SharePoint interface styles to inherit from your default document styles. Take a look at the SharePoint 2010 CSS Reset from Kyle Schaeffer. I didn't test it yet, but it seems to do exactly ...


3

It's possible to use plain link tag in your master page header if you can't use <SharePoint:CSSRegistration ... />, as in the case where you want to use the media attribute. <link type="text/css" rel="stylesheet" media="only screen and (min-width: 1024px)" href="Style/default.css" /> <link type="text/css" rel="stylesheet" media="only screen ...


3

try changing it to div#suiteBarLeft{ background-color: red !important; }


3

Since it is CSS attributes, the server will not send any of the pictures until the browser parses the CSS and request one of the images based on how it interprets the CSS. Too me, I do not see why this shouldn't work. Just give it a try and then use fiddler or similar to se which requests and responses are sent between the browser and the server. To ...


3

Many of the class/id names have changed. Some slightly, some significantly and some are still the same. Off the top of head and from briefly flipping through my notes a few (related to quick-launch and navigation): /*2010 quick launch or current navigation*/ #ms-quickLaunch { your styles } /*2013 quick launch or current navigation*/ #sideNavBox { your ...


3

try <SharePoint:CSSRegistration ID="CSSReg5" name="<%$SPUrl:~SiteCollection/Style Library/CSS/styles.css%>" After="corev4.css" runat="server"/> the part <%$SPUrl:~SiteCollection points to the root site collection, maybe your code is not pointing to that location! rather the site or sub site, method above explicitly says root site collection ...


3

this function set field limit characters: function setFieldLimitCharacters( field, limit ) { field.unbind( 'keyup change input paste' ).bind( 'keyup change input paste',function(e){ if( $( this ).val().length > limit ) { $( this ).val( $( this ).val().substring( 0, limit ) ); } }); } usage: ...


3

in your page make sure there is no reference to core.css.... issue is due to masterpage which has that reference that the page your using could be referencing the masterpage. several methods: 1) if its referencing a masterpage than make a custom masterpage that is almost the same only that it doesnt contain the core.css reference. 2) within your css add ...


3

You could either change the icon for htm pages in the hive (its ichtm.gif by default ["ic" for icon and "htm" for filetype]) or overwrite it by CSS or JS. Here's a example for plain CSS: img[src="/_layouts/15/images/ichtm.gif"] { background-image: url("http://upload.wikimedia.org/wikipedia/commons/f/f0/Pdf_16x16_Crystal_SVG.png"); height: 0px; ...


3

You can easily add a content editor webpart and add in your CSS in the HTML editor. Or you can add your CSS to a text file, then using a content editor webpart, you can reference that text file and it will include the css in that page.


3

In SharePoint the "page" is actually inside of a DIV and the window really never scrolls... The content inside that DIV does scrolls (unless you have a customized branded site). So although your code will work on a standalone HTML page, it will not in a standard Sharepoint site (2010 and above)... See the solution I posted here to a similar question. ...


2

Why not just wrap it in an element with a specific CSS class? <ul> <!-- snipped --> <li class="ms-comm-adminLinksListItem" unselectable="on"><a href="https://login.salesforce.com/" target="_blank" unselectable="on"> Salesforce </a></li> <div class="codeSnippet"> //code goes here </div> </ul> ...


2

Yes you can. In your custom jsfile put the following code inside document.ready: $("#Ribbon\\.WebPartPage-title a").css('border-color', '#FF0000'); $("#Ribbon\\.WebPartPage-title a").css('border-top', '4px solid #FF0000'); Replace #FF0000 by your colour Edit 4 This is my Chrome console after putting this code and pressing enter After some seconds I ...


2

You can edit the Quick Launch Navigation control and set Static Display Level, Dynamic Display Level properties PS: It was this way in SP 2010, I hope its the same in 2013


2

You can modify the CSS for your target calendars. The CSS you want is .ms-acal-item { BORDER: #xxxxxx; BACKGROUND-COLOR: #xxxxxx } .ms-acal-default-hover { BORDER: #xxxxxx; BACKGROUND-COLOR: #xxxxxx } .ms-acal-apanel-item { BORDER: #xxxxxx; BACKGROUND-COLOR: #xxxxxx } Throw this in a code snippet or HTML form web part and you should be good. More on my ...


2

You need to know that each ribbon has a different background color, border, etc. to differentiate functionality. It is indeed not necessarily recommended to make them all uniform. Neverthelless, each ribbon has also it's own CSS selector and if you really want them all, you would need to change all, one by one and keep testing in various contexts ...


2

One thing I see right away is that you are using a selector with brackets ("td[vAlign]"). IE 7 doesn't not support CSS selectors in that fashion. This post has a good explanation of what CSS selectors do and dont work in IE 7: http://evotech.net/blog/2007/05/ie7-css-selectors-how-they-fail/


2

This really depends on how big your CSS and Javascript files are. It also depends on if you guys are using revision on your client-side files. And of course how much content (webparts, custom controls etc) there is on the pages the users enter. First I'd advice you to use revision on your links to CSS and javascript files. This saves HUGE response time as ...


2

If the idea is that some content should "fall behind" the Ribbon (such as a header, navigation, etc.) you can just place your markup in the with the ID "s4-titlerow". This gets automatically hidden when the Ribbon displays, giving the effect that the Ribbon falls "on top" of the content. Otherwise, I would give a try to any of the script proposed ...



Only top voted, non community-wiki answers of a minimum length are eligible