Basic Gray Theme - Home ( Photo...

Aug 26th, 2011 at 08:16 PM
User 2924428 Photo

bough
Registered User
1,718 posts

Ok that will fit it to the frame in the css file?
Aug 26th, 2011 at 08:52 PM
User 187934 Photo

Eric Rohloff
Senior Advisor
20,271 posts

Now check your css for the #photo div h3
and make it look like this.

#photo div h3 {
background-image: url("../images/DSCN1150.JPG");
}

I see the image url looking a little wacky.

background-image: url("\"../images/DSCN1150.JPG\"");
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
Aug 28th, 2011 at 01:47 PM
User 2924428 Photo

bough
Registered User
1,718 posts

I'm going to have to copy/paste your code into my .css file, I removed it but remembered it was on line 256 of the CSS sheet. So i'm going to resize a picture and try and see if we can get something going here again, thanks for your help again! Much appreciated :D
Aug 28th, 2011 at 01:54 PM
User 2924428 Photo

bough
Registered User
1,718 posts

Well I resized the image and included it in my .css file now should there be something done to the HTML file? cause it's uploaded and not showing a difference, I dunno! :)
Aug 28th, 2011 at 01:56 PM
User 2924428 Photo

bough
Registered User
1,718 posts

Got it! Thanks man I appreciate everything you've done for me!!
Aug 28th, 2011 at 02:28 PM
User 2924428 Photo

bough
Registered User
1,718 posts

So I got the image to work however my positioning isn't exactly correct, how do I fix this problem, you'll see at http://test.roundsandbars.biz that the picture doesnt line up with the outline of the photo, thanks again Rolly!!
Aug 28th, 2011 at 08:28 PM
User 187934 Photo

Eric Rohloff
Senior Advisor
20,271 posts

I would make that image 235 high by what ever wide to keep the proper proportions.:)
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
Jan 18th, 2012 at 12:26 PM
User 1872717 Photo

Tom Weiland
Registered User
2 posts

Okay, think I'm close; (RE: www.weiland.me)
#photo div h3 {
background-image:url('../images/Tom2s.jpg');
width:256px;
height:160px;
margin-left:60px;
margin-top:20px;
}

When I adjust the
margin-top:20px;
value it moves the black box down from the white (anchor) how can I move the photo down to center in the black box??

Thanks for all your help I too am learning CSS
Tom
Jan 18th, 2012 at 02:49 PM
User 122279 Photo

Inger
Senior Advisor
14,649 posts

Go to the div above that and insert a padding value, like this:
#photo div {
background-color: #333;
margin: 10px auto 0 auto;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
padding-top: 30px;
width: 380px;
height: 260px;
text-align: center;
}


You may have to experiment with the padding value until you get it the way you want.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Jan 18th, 2012 at 03:15 PM
User 122279 Photo

Inger
Senior Advisor
14,649 posts

I did some experimenting myself since I noticed that the dark background was too far down. Here is the code that I came up with:
#photo div {
background-color: #333;
margin: 10px auto 0 auto;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
padding-top: 26px;
width: 380px;
height: 252px;
text-align: center;
}
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.