Solved

Centering captions with css

Posted on 2014-03-25
2
243 Views
Last Modified: 2014-03-25
Hello,
I'm creating a photo gallery here http://www.paulb.com/1-gallery.htm and I'm trying to center the captions under the pics. I've tried setting the margins to auto, adding padding and margins, but I can't get them to move at all, let alone centered.
 I also have the attached gallery.css file that's attached to the page, but I don't thing it affects what I'm trying to do here.
Thanks,
Paul

This is the code I'm using on this page only:


<style type="text/css">
#gallery #thumbs tr td a img {
            text-decoration: none;
      border-top-width: 0px;
      border-right-width: 0px;
      border-bottom-width: 0px;
      border-left-width: 0px;
      border-top-style: 0;
      border-right-style: 0;
      border-bottom-style: 0;
      border-left-style: 0;
      margin-bottom: 10px;
      /*text-align: left;*/
      margin-left: 10px;
      }
#gallery #thumbs tr td h3 a {
      font-size: 12px;
      color: #33cc00;
      text-align: center;
      text-decoration: none;
      font-family: AndikaBasicRegular;
      padding-left: 25px;
      margin-left: 25px;
}
</style>
gallery.css
0
Comment
Question by:paulbsb
2 Comments
 
LVL 8

Accepted Solution

by:
soupBoy earned 500 total points
ID: 39954536
Try adding:
text-align: center;
display: block;

to your anchor (a):

#thumbs tr td h3 a {
      font-size: 12px;
      color: #33cc00;
      text-align: center;
      text-decoration: none;
      font-family: AndikaBasicRegular;
      padding-left: 25px;
      margin-left: 25px;
      text-align: center;
      display: block;
}
0
 

Author Closing Comment

by:paulbsb
ID: 39954577
It works. I had tried the text align: center; but not the display:block;
Thanks!
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Suggested Solutions

I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …

747 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

14 Experts available now in Live!

Get 1:1 Help Now