Question for Mr. Williams

[digitalbill]

They say that imitation is the greatest form of flattery.. I am REALLY NOT trying to steal your entire website but its so clean and professional looking that i am trying to borrow some of its style. Hope you don't mind. Having said that, how did you get your gallery captions to show up under the pics instead of to the right? I am VERY new to this so its been a loooongg road trying to figure this out. I am making some progress albeit bery slowly. Thanks for all the awesome posts here and your work is exceptional. I've seen some of the CLASS and iD reference tags screenshots but is there a COMPREHENSIVE doc or pdf or soemthing that lists ALL of them?? Eventually, i woul dlike to have my entire page background black as well instead of the gray gallery background.

www.customsportphotos.com (http://www.customsportphotos.com)
bill

[Andy]

Thanks!

Imitation is cool = copying not cool. I love to share all the ideas I can find and make happen -- then it's up to you to put your personal touches on the site!

1) READ the FAQ:
http://www.dgrin.com/showthread.php?t=26043
Many, many basic q's are covered in the FAQ.

2) Get Firefox and the Web Dev Toolbar:
http://www.dgrin.com/showpost.php?p=228977&postcount=4
This will allow you to see ALL the elements on ANY page, and to easily figure out how the CSS Stuff works. Ask any questions you want about how to do things here, we'll do our best to help you as fast and as best as we can :D

3) Boxes:
.box { background-color: blue; }
.box { background-color: transparent; }

etc

[Andy]

Having said that, how did you get your gallery captions to show up under the pics instead of to the right?

BTW, once you have Firefox and the WebDev toolbar, you can see stuff like this on people's sites:


#galleriesBox .miniBox {margin:0 20px; padding:0; height:260px; width:142px;}
#galleriesBox .miniBox .nav, #galleriesBox .miniBox .private, #galleriesBox .miniBox p.updated, #galleriesBox .miniBox p.description, #galleriesBox .miniBox p.albumTitle {display:block; text-align:center;}
#galleriesBox .miniBox .photo {width:142px; height:auto; _height:1%;}

I am NOT a programmer :D

[digitalbill]

definitely not here to copy. thanks for the direction. I actually do have the web dev toolbar for firefox but i guess i am still a little slow. I've also visited the FAQ and have actaully used some of those techniques.

Thanks for the info on the centering of the boxes.still not sure if i am grasping it but i will play around a bit.

[digitalbill]

#galleriesBox .miniBox {margin:0 20px; padding:0; height:260px; width:142px;}
#galleriesBox .miniBox .nav, #galleriesBox .miniBox .private, #galleriesBox .miniBox p.updated, #galleriesBox .miniBox p.description, #galleriesBox .miniBox p.albumTitle {display:block; text-align:center;}
#galleriesBox .miniBox .photo {width:142px; height:auto; _height:1%;}


I tried adding those but i get no change in the appearance whatsoever. Do i need to create my own theme/stylesheet first and include it?


I am NOT a programmer :D

You do a very good impression :p

[DavidTO]

Who is this Mr. Williams guy? :scratch

[Andy]

I tried adding those but i get no change in the appearance whatsoever. Do i need to create my own theme/stylesheet first and include it?


You do a very good impression :p

OK we need one of the stylers to help... I'll holler for him.

[Mike Lane]

First off, make sure all of your elements are closed and you've got quotes where you need to have quotes. In your header you've got an image linked but the url in the <a> tag doesn't have quotes. Also in your footer you're missing an </table> which is causing you some problems. Fix your html first and then we'll worry about your CSS.

[Mike Lane]

Here's your header:

<div align='center' style="background-color: #000000; color: #000000;">
<a href = http://www.customsportphotos.com BORDER = 0>
<img src="/photos/56332695-M.jpg" border=0> </a>
<br/>


<a href="mailto:info@customsportphotos.com?subject=Custom%2 0Photo%20Information">
<font size="2" color="#3333FF" face="Arial">Click here to inquire about Custom Work</font></a>
</span>
<br/><br/>
</div>
Also in your html you can't use single quotes. So div align='center' is invalid. In html whenever you see an equals sign you need to have a double quotes. So <a href="whatever"> or <img src="whatever" border="0"> and so on. Make sure you have corresponding ending tags only where necessary. In your header you've got a misc. </span> just hanging out there.

Here's your footer:

<div id="bill_footer" name="bill_footer" style = "display: none;" >
<table width="100%">
<tr><td width="5"><img src="http://top.smugmug.com/photos/56290023-M.jpg"></td>
<td> &nbsp;</td>
<td width="5"><img src="http://top.smugmug.com/photos/56293436-M.jpg"></td></tr>
</div><br/>
<div>


</div>You can't have an id and a name the same. So having id="bill_footer" and name="bill_footer" is invalid (see this (http://www.w3.org/TR/REC-html40/struct/links.html#h-12.2.3) for more). You must have an </table> before the first </div>. Not sure why you've got the 2nd <div> </div> in there.

Anyhow, fix all that up and then we'll chat about the CSS.

[digitalbill]

Yup i DID see a bunch of those errors and fixed them and i DID get the changes to work. Thanks for putting up with me but when i changed the location of the gallery text a whole bunch of new problems popped up. So i thing its wise for me to back up and regroup and decide on a solid design before i go messing anything else up. I appreciate your help and will revisit this soon.