 |
|
|
| View previous topic :: View next topic |
| Author |
Message |
astro211

Joined: 28 Aug 2008 Posts: 18 Location: Adirondacks NY
|
Posted: Thu Oct 02, 2008 1:30 pm need help with image size applied to class |
|
|
|
Hi, I'm trying to take my settings out of the HTML code and put it in my style sheet for the width of my images. I am not sure of the syntax for the line I need to add to my stylesheet to accomplish this. I tried using, #samples {width: 150px; height: 193px; border: 0px} But when I load it in my browser, instead of the images being displayed in a 2x2 grid like I want them, they are all overlapping each other. I have set the height of the samples_container to 450px. I appreciate the help.
I'm pasting the code from my htm file below.
<div id="samples_container">
<div id="sample1" class="samples">
<h3>Paint Ball Fun</h3>
<a href="sample1.jpg"><img src="sample1.jpg" width="150" height="193" border="0" /></a>
</div>
<div id="sample2" class="samples">
<h3>Longs Peak Memories</h3>
<a href="sample2.jpg"><img src="sample2.jpg" width="150" height="193" border="0" /></a>
</div>
<div id="sample3" class="samples">
<h3>Trick or Treat!</h3>
<a href="sample3.jpg"><img src="sample3.jpg" width="150" height="193" border="0" /></a>
</div>
<div id="sample4" class="samples">
<h3>Michael's First Concert</h3>
<a href="sample4.jpg"><img src="sample4.jpg" width="150" height="193" border="0" /></a>
</div>
</div> |
|
Corey Bryant Site Admin

Joined: 15 May 2004 Posts: 8429 Location: Castle Pines North, CO USA
|
|
astro211

Joined: 28 Aug 2008 Posts: 18 Location: Adirondacks NY
|
Posted: Thu Oct 02, 2008 3:28 pm I guess I'm not being clear |
|
|
|
I'm sorry, I am very new to HTML and I appreciate the help.
The code is not from my stylesheet. I pasted the code from within the body of my HTML file. What I want to know is can I take out the inline attributes for the image size and set the size for all images in the samples class in my style sheet. If I can, what is the code to do this. The headings will stay with the images and that is fine. They are the headings for the images. |
|
sticks464

Joined: 31 Dec 2006 Posts: 1284
|
Posted: Thu Oct 02, 2008 4:10 pm |
|
|
|
| Code: |
.samples img {
width:150px;
height:193px;
border:none;
} |
Should do the trick.
Go to http://www.pmob.co.uk/ about 3/4 of the way down the page gives various examples of captions for inline images. |
|
astro211

Joined: 28 Aug 2008 Posts: 18 Location: Adirondacks NY
|
Posted: Fri Oct 03, 2008 3:27 pm It worked |
|
|
|
| Thank you very much. That worked just fine for me. |
|
|
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum
|
|
|
|
|
 |
|
|
|
|
|
|
|