Solution 1
I got the solution guys…
The picture library webpart uses the css classes in corev4.css in sharepoint 2010. The web part uses “.ms-WPBody” css class for styling. I over wrote this class in my custom style sheet as “.ms-WPBody.noindex” and gave my custom settings in the properties.
And thats it, my webpart aligned to the center of the page with my custom settings.
The picture library webpart uses the css classes in corev4.css in sharepoint 2010. The web part uses “.ms-WPBody” css class for styling. I over wrote this class in my custom style sheet as “.ms-WPBody.noindex” and gave my custom settings in the properties.
And thats it, my webpart aligned to the center of the page with my custom settings.
- Marked As Answer byP6520Tuesday, August 10, 2010 11:24 PM
You can find “.ms-WPBody” class in corev4.css. When I look into the webpart through the developer tools in internet explorer, O came to know that, the webpart style is based on “.ms-WPBody.noindex” css class. So, I wrote my custom css using this class name as follows:
Also, I am attaching the document with the images before and after applying css classes.
http://www.sendspace.com/file/r4meyx
I hope this clears the confusion. If I am wrong, please correct me.
.ms-WPBody.noindex{
font-size:8pt;
font-family:"Segoe UI" !important;
}
.ms-WPBody.noindex table{
font-size:1em;
width:100% !important;
height:100% !important;
}
.ms-WPBody.noindex td{
font-size:10pt;
font-family:"Segoe UI" !important;
width:100% !important;
height:200px !important;
margin-left:auto !important;margin-right:auto !important;
/* text-align:center !important;*/
}
.ms-WPBody.noindex td div{
height:auto !important;
width:100% !important;
text-align:center !important;
display:block !important;;
}
.ms-WPBody.noindex td div span{
width:100% !important;
}
.ms-WPBody.noindex td img{
height:100% !important;
width:100% !important;
}
Also, I am attaching the document with the images before and after applying css classes.
http://www.sendspace.com/file/r4meyx
I hope this clears the confusion. If I am wrong, please correct me.
Solution 2
<script>
$(document).ready(function() {
var divList = $("div[id^='MSOPictureLibrarySlideshowWebPart']");
var currImage= $("img[id$='curr']");
divList.height('100%');
divList.width('100%');
currImage.height('100%');
currImage.width('100%');
});</script>
customize slide viewer
ReplyDelete