Basic Gray Theme - Home ( Photo...

User 2924428 Photo


Registered User
1,718 posts

Hello Coffeecup Forums! I need your help. The Basic Gray Theme - Home for HTML 12 build 375 photo spot isn't aligning when I place a photo on there, it just overlaps and lands somewhere in the center. Can you please help me? It's a pre-built theme in CoffeeCup titled Basic Gray Theme - Home. You'll be able to see what i'm talking about if you load, thanks for your help! :D
User 122279 Photo


Senior Advisor
14,649 posts
Online Now

It would be easier to help if we could see this. Got a URL?
Ha en riktig god dag!
Inger, Norway

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


User 187934 Photo


Senior Advisor
20,271 posts

Look for this in the HTML. Delete the word Photo.
<div id="photo">
<div>
<h3>Photo</h3>
</div>
</div>


Now look for this in the CSS and add a image url. You'll still have to tweak the CSS to get your photo positioned properly depending on the size.
#photo div h3 {
color: #fff;
font-size: 25px;
line-height: 25px;
padding: 115px 0 0 0;
}
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
User 2924428 Photo


Registered User
1,718 posts

Thanks for helping but i'm still a bit confused, say I have a image saved to desktop, where in the css would I add the url exactly? Thanks again for helping!
User 187934 Photo


Senior Advisor
20,271 posts

This will get you in the ball park.:)
#photo div h3 {
background-image:url('../images/myimage.jpg');
width:246px;
height:246px;
margin-left:70px;
}


The image I tested with is 246 by 246.
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
User 2924428 Photo


Registered User
1,718 posts

Hey thank you very much I appreciate it!
User 2924428 Photo


Registered User
1,718 posts

Heres my coding using "add image" button to default.css
Then I just save the css coding and the image should show right?

#photo div h3 {
background-image:url('<img src="../DSCN1104.JPG" width="246" height="246" alt="" border="0">');
width:246px;
height:246px;
margin-left:70px;
}
User 2924428 Photo


Registered User
1,718 posts

Saving default.css and it hasn't changed in preivew :( I never used CSS before so thanks for taking the time out to help me!
User 2924428 Photo


Registered User
1,718 posts

Does the HTML have anything to do with the default.css because I believe I accidently removed the tags for the HTML. It's still not previewing any pictures yet i'm hoping it will show up soon. BTW i'll be putting up a test site if you could visit it and help me I would appriciate it. Many thanks - Matt.
User 187934 Photo


Senior Advisor
20,271 posts

This assumes your image is in the same directory as your html page and your default CSS is still in the stylesheets folder.
#photo div h3 {
background-image:url('../DSCN1104.JPG') ;
width:246px;
height:246px;
margin-left:70px;
}
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

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.