Advanced search  

News:

cpg1.5.48 Security release - upgrade mandatory!
The Coppermine development team is releasing a security update for Coppermine in order to counter a recently discovered vulnerability. It is important that all users who run version cpg1.5.46 or older update to this latest version as soon as possible.
[more]

Pages: [1]   Go Down

Author Topic: Category List Alignment: Customizing my theme based of water-drop  (Read 6055 times)

0 Members and 1 Guest are viewing this topic.

MadVelvet

  • Coppermine newbie
  • Offline Offline
  • Gender: Female
  • Posts: 15
    • Mystic Bliss

Hello,

I'm a bit of a noob but here goes:

I've been customizing the water-drop theme to fit my colors, etc.  I thought great, looks good, time to add categories.

I go home to see how it looks and they category names/descriptions are aligned in the middle.  I have checked my style.css and index template and all looks like how it should be.  I'm just at a lost and turning to the experts for help.

my site is www.madsland.net/gallery so you can see what I am talking about.

test login is: usertest (this does not have admin status, does it need to?)
password: password

How I learn a lot is by viewing page source and inspect element.  When viewing page source it shows:
Quote
             
<!-- Start standard table -->
<table align="center" width="100%" cellspacing="1" cellpadding="0" class="maintable ">
 
        <tr>
                <td class="tableh1" width="80%" align="left">Category</td>
                <td class="tableh1" width="10%" align="center">Albums</td>
                <td class="tableh1" width="10%" align="center">Files</td>
        </tr>
 
        <tr>
                <td class="catrow_noalb" colspan="3"><table border="0"><tr><td align="left"></td><td align="left"><span class="catlink"><a href="index.php?cat=2">Magazines &amp; Articles</a></span>Scans from various print media, like newspapers and magazines.</td></tr></table></td>
        </tr>
 
        <tr>
                <td class="catrow_noalb" colspan="3"><table border="0"><tr><td align="left"></td><td align="left"><span class="catlink"><a href="index.php?cat=3">Movies, Stage &amp; Television</a></span>Various stills and images from Mads&#039; varied career in movies, stage and television.</td></tr></table></td>
        </tr>

So I go to my style.css to look up tableh1 and it shows:
Quote
.tableh1 {
    font-family:  Verdana, Geneva, Arial, sans-serif;
    background : #C0C1D5 ;
    color: #31307E;
    font-weight:bold;
    padding-top: 3px;
    padding-right: 10px;
    padding-bottom: 3px;
    padding-left: 10px;

I also looked up catrow_noalb:
Quote
.catrow_noalb {
    background: #CBD7DE ;
    color : #000000;
    padding-top: 3px;
    padding-right: 10px;
    padding-bottom: 3px;
    padding-left: 10px;

Then looked up catlink:
Quote
.catrow {
    background: #F2F5F7 ;
    padding-top: 3px;
    padding-right: 10px;
    padding-bottom: 3px;
    padding-left: 10px;

my index.template has this: (I did not include all the closing tags in this quote at the end just to save space)
Quote
</head>
<body>
  {CUSTOM_HEADER}
<td align="center">
  <table width="940px" border="0" cellpadding="20" cellspacing="20">
    <tr>
      <td valign="top" style="border: 1px solid #31307E; background-color: #31307E;">
        <table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td width="100%" align="center">
<img src="http://www.madsland.net/gallery/images/MadsLandHeader-01.jpg"><br><br>
              {SYS_MENU}<br />{SUB_MENU}
            </td>
          </tr>
        </table>
        <img src="images/spacer.gif" width="1" height="15" alt="" />
        <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td valign="top">
              {ADMIN_MENU}
              {MESSAGE_BLOCK}
              {GALLERY}
  {CUSTOM_FOOTER}{CREDITS}

I went to theme.php
and I cannot view anything there.

I hope I provided the right information.  I'm pretty new at this but think I'm doing pretty good until this...it seems it should be something so simple.

Thank you for any assistance provided.

MadVelvet
Logged

Nibbler

  • Guest
Re: Category List Alignment: Customizing my theme based of water-drop
« Reply #1 on: August 27, 2010, 11:33:55 pm »

Code: [Select]
table {
    font-size : 12px;
    margin: 0 auto;
    align: center;
}

The "margin" is centering all tables, causing the problem. The "align" is invalid, you may as well remove it.
Logged

MadVelvet

  • Coppermine newbie
  • Offline Offline
  • Gender: Female
  • Posts: 15
    • Mystic Bliss
Re: Category List Alignment: Customizing my theme based of water-drop
« Reply #2 on: August 27, 2010, 11:34:17 pm »

Forgot to mention I have cpg1.5.8
Logged

MadVelvet

  • Coppermine newbie
  • Offline Offline
  • Gender: Female
  • Posts: 15
    • Mystic Bliss
Re: Category List Alignment: Customizing my theme based of water-drop
« Reply #3 on: August 27, 2010, 11:37:18 pm »

Thanks that fixed my category list alignment but now my center area is aligned left and not centered showing my background on both sides.  Any suggestions? 
Logged

Jeff Bailey

  • Dev Team member
  • Coppermine addict
  • ****
  • Country: us
  • Offline Offline
  • Gender: Male
  • Posts: 1322
  • Fishing relaxes me.
    • Bailey Family Co.
Re: Category List Alignment: Customizing my theme based of water-drop
« Reply #4 on: August 28, 2010, 12:10:11 am »

add
Code: [Select]
margin: 0px auto;to
Code: [Select]
[s]table {
}[/s]

should work for most browsers.

edit -  ::) was reading to many things at once. Sorry.
« Last Edit: August 28, 2010, 12:53:17 am by Jeff Bailey »
Logged
Thinking is the hardest work there is, which is probably the reason why so few engage in it. - Henry Ford

MadVelvet

  • Coppermine newbie
  • Offline Offline
  • Gender: Female
  • Posts: 15
    • Mystic Bliss
Re: Category List Alignment: Customizing my theme based of water-drop
« Reply #5 on: August 28, 2010, 12:28:17 am »

Yes but that's what I just had to remove (see the reply from Nibbler) in order to get my category list alignment right.  I want my category list alignment to be left-aligned but I want my center area in the center.  Is it not possible to have both?
Logged

Nibbler

  • Guest
Re: Category List Alignment: Customizing my theme based of water-drop
« Reply #6 on: August 28, 2010, 12:47:23 am »

First you need to remove the bad markup: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.madsland.net%2Fgallery%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

You have a <td align="center"> and an </table> in there for some reason. Then you attach an id to the main table in template.html

Code: [Select]
<table id="mymaintable" width="940px" border="0" cellpadding="20" cellspacing="20">

and apply the margin to that

Code: [Select]
#mymaintable {
    margin: 0px auto;
}
Logged

MadVelvet

  • Coppermine newbie
  • Offline Offline
  • Gender: Female
  • Posts: 15
    • Mystic Bliss
Re: Category List Alignment: Customizing my theme based of water-drop
« Reply #7 on: August 28, 2010, 01:07:54 am »

Thank you so much Nibbler, you saved me hours and hours of trying this and trying that .  You all would laugh at me as I design my stuff, not just my coppermine (which has been the easiest by far) but my wordpress and smf forum.  I try and refresh, nope, undo, try this and refresh, nope, undo....hahahahahahaha.  I usually can figure it out by viewing source and inspect element.  I've learned a lot that way.

Anywho I ramble.  Thank you thank you thank you!!!!  This can be marked solved!!!!  :)
Logged
Pages: [1]   Go Up
 

Page created in 0.031 seconds with 19 queries.