Change gallery caption font size

Hi
I just created my first gallery page and it worked perfectly using the tutorial supplied on this site but the picture caption font is way to big and bold with not obvious was of changing it to suit. Is there a way to adjust font size and weight within the admin panel or via custom CSS?
Cheers

 

Hello,

Please provide link of the gallery page. Where you are facing this problem.

Thanks & Regards
Pramod

 

I haven't made it live yet as I don't want people seeing it as it is but please see attached screen shot of the preview. When creating the gallery the captions look as you would expect it's just when you publish/preview that the default font seems to be wrong.
many thanks

 

Hi Srmoody,

Please paste the code given below in custom css.
(Appearance->Theme Options->Styling Options->Custom Css) of your dashboard.

Code:

.page-content .gallery ul li a.gall-content {
font-size: 12px;
font-weight: normal;
}

Note: You can change font-size and font-weight according to your need.

Thanks
Praveeb

 

This works great for the size but the caption now aligns over the picture not underneath where I would expect it
Cheers

 

Hi Srmoody,

Could you please provide us your site URL with some edited screen shots of your issues, so that we can have a detail look over them and provide the exact solution ASAP ?

Thanks

Praveen

 

Hi
Thanks, and sorry this is being a pain. From the attached screenshots you will see everything looks fine in the draft but the preview has excessive line spacing and starts over the picture which looks scruffy.
URL is www.originallaserstudio.co.uk. As I mentioned the the font size issue was remedied by the previous code.

Cheers

 

Hi Srmoody,

Please paste the code given below in custom css.
(Appearance->Theme Options->Styling Options->Custom Css) of your dashboard.

Code:

.page-content .gallery ul li h2 {
margin-top: 0px;
}
 
.page-content .gallery ul li a.gall-content {
font-size: 10px;
line-height: 0;
}
 
a.gall-content {
color: black !important;
}
 
a.gall-content:hover {
color: red !important;
}

Thanks
Praveen

 

That worked great, thanks Praveen