HTML - Aligning Tall And Wide Pictures

How wide should you make your page/site?
Since most have different size monitors and settings, how wide should your page be so it's not tiny on one user's monitor, and not too big on another?

Hello, okay, so i was thinking about redesigning my site because i never really have done so before. but as i was thinking, i was thinking it would be nice to be able to fit more stuff across the screen width wise.... right now my website has like 750px width...
and i was wondering if i increased it some, would the majority of the people not have a problem viewing it? and if so, how many pixels wide do u think i could go before its too wide...
i have my screen resolution said at 1280x1024...
does anybody know what the majority of people set their screen resolutions to?
any help would be great..thanks..

when working locally in the latest Version of IE. They show up fine in FireFox. I searched the forum but it didn't turn any thing up. I tried my setting in IE but can't figure this out. Does anyone have a simple fix for this?

Thanks....tg

Relating to: http://www.envirotechuk.org/show.php?page=2

I'm trying to get the news section of this page up and running properly, and this is a "template" I have come up with so far, but as you can see it is a very ugly look, very simple, and does not align properly.

The code I am using for this page so far is:

<br><blockquote><h1><font face="century gothic,comic sans ms,dotum">News from 26-30th April, 2010</font></h1></blockquote>
<p><br>

[image-left:parliamentfinal.jpg]
<B>Parties Clash Over Climate Change Credentials </B><br><br>
For more information, visit <A HREF="http://www.independent.co.uk/environment/climate-change/parties-clash-over-climate-credentials-1954632.html">http://www.independent.co.uk/environment/climate-change/parties-clash-over-climate-credentials-1954632.html</A>
<br><p><hr><p>


[image-left:renewablefinal.jpg]
<b>Britain reaches milestone for renewable energy </B><br><br>
For more information, visit <A HREF="http://www.independent.co.uk/environment/climate-change/britain-reaches-milestone-for-renewable-energy1952990.html">http://www.independent.co.uk/environment/climate-change/britain-reaches-milestone-for-renewable-energy-1952990.html</A>
<br><br><br><p><hr><p>

[image-left:airportfinal.jpg]
<b>Empty skies proved that airports cause pollution </b><br><br>
For more information, visit <A HREF="http://www.independent.co.uk/environment/climate-change/parties-clash-over-climate-credentials-1954632.html">http://www.independent.co.uk/environment/climate-change/parties-clash-over-climate-credentials-1954632.html</A>
<br><P><hr><p>

[image-left:earthquakefinal.jpg]
<b>Tiny climate changes may trigger quakes</b><br><br>
For more information, visit <A HREF="http://www.independent.co.uk/environment/climate-change/tiny-climate-changes-may-trigger-quakes-1948432.html">http://www.independent.co.uk/environment/climate-change/tiny-climate-changes-may-trigger-quakes-1948432.html</A>
<br><br><p><hr><p>

[image-left:batteryfinal.jpg]
<b>Giant batteries could make renewable energy more reliable</b><br><br>
For more information, visit <A HREF="http://www.guardian.co.uk/environment/2010/apr/26/gravel-batteries-renewable-energy-storage">http://www.guardian.co.uk/environment/2010/apr/26/gravel-batteries-renewable-energy-storage</A>
<br><br><p><hr><p>

Does anyone know of anything I can do to make the page look a bit better, and to line up better. All the pictures are 100x(52-100) pixels, but I can only find ways to set the maximum width, nowhere can I seem to resize it to 100x100, or something along those lines.

Maybe a good website that resizes pictures to exact sizes? Or is there a template I can use to separate the articles a bit more and give it a uniform look, that will allow for the different heights of the pictures?

Any help would be appreciated.

hello,
how can i place pictures i wrote a poem left side and need place a pic right side of the poem but it goes right side of where the poem end
any help appreciated

http://www.reliablegaming.com/test/games2.html

I cant seem to get text under each picture, only on the sides....could someone do 1 and resend code so i can see how you did it?


Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Welcome to Reliablegaming</title>
<link href="style/style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style1 {
	font-size: 14px;
	font-weight: bold;
}
-->
</style>
</head>

<body>
<table width="969" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="15" class="l-bg"><img src="images/bg-left.gif" alt="Reliablegaming" width="15" height="19" /></td>
    <td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="940" height="208">
          <param name="movie" value="images/top01.swf" />
          <param name="quality" value="high" />
          <embed src="images/top01.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="940" height="208"></embed>
        </object></td>
      </tr>
      <tr>
        <td><img src="images/barbg.gif" alt="Reliablegaming" width="940" height="58" border="0" usemap="#Map" href="#" /></td>
      </tr>
      <tr>
        <td align="center" valign="top" class="bg1"><blockquote><span class="style1"><u>ReliableGaming - Game Packages</u></span><br>
          <p align="center"><a href="Drag to a file to make a link."><img src="images/bf2.jpg" width="100" height="100" /></a>&nbsp;<img src="images/bf2142.jpg" alt="" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="" width="100" height="100" />&nbsp;<img src="images/cs1.6.jpg" alt="" width="100" height="100" />&nbsp;<img src="images/cscz.jpg" alt="" width="100" height="100" /></p>
          <p align="center"><img src="images/dod.jpg" alt="f" width="100" height="100" />&nbsp;<img src="images/dods.jpg" alt="f" width="100" height="100" />&nbsp;<img src="images/tf2.jpg" alt="f" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="f" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="f" width="100" height="100" /></p>
          <p align="center"><img src="images/css.jpg" alt="f" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="f" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="f" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="f" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="f" width="100" height="100" /></p>
          <p align="center"><img src="images/css.jpg" alt="rwer" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="werwer" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="werwe" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="ewrwe" width="100" height="100" />&nbsp;<img src="images/css.jpg" alt="rwer" width="100" height="100" /></p>
          <p align="center">&nbsp;</p>
          <p align="center">&nbsp;</p>
          </blockquote>
          </td>
      </tr>
	    <td height="30" align="center" valign="middle"  class="bg1"><a href="#" class="footerlink">Home</a>  |   <a href="terms.html" class="footerlink">Terms of Service</a>   |   <a href="http://www.reliablegaming.com/modernbill/order/?v=1" class="footerlink">Packages</a>  |   <a href="forums/" class="footerlink">Forums</a>  | <a href="mailto:admin@reliablegaming.com" class="footerlink">Contact Us</a>  |   <a href="index.html" class="footerlink">ReliableGaming</a></td>
      <tr>
	  
        <td><img src="images/footer.gif" width="939" height="74" border="0" /></td>
      </tr>
    </table></td>
    <td width="15" class="r-bg"><img src="images/bg-right.gif" alt="Reliablegaming" width="15" height="19" /></td>
  </tr>
</table>

<map name="Map" id="Map"><area shape="rect" coords="152,4,263,26" href="mailto:admin@reliablegaming.com" />
<area shape="rect" coords="34,7,113,25" href="forums/" />
<area shape="rect" coords="734,6,855,25" href="/support.html" />
</map>
</body>
</html>

when I preview my website a active x bar shows up and another thing is that my pictures are not showing. What can I do?

can a border be made around a picture without making a table?

TIA

I created this website, http://solarroadways.com/news.html
and everything I created worked. Then my client added new content and pictures by themself and apparently the images load but then disappear in IE. Debugging didn't help, go figure. Anyone encounter this problem?

Hi, guys.

Both new to forums and HTML, but learning fast!

I'm currently working on a project, got design and everything ready, and I have created all <div-tags> that I need. I now have a problem with pictures now showing up as I want them. I have created a graphic element for example, with squares on the bottom of the page, and the file is saved as .png, with an opacity.

When I specify which file it is in the CSS file, pictures won't show up. Might it be cause the file has an opacity on the direct graphic, and if so; is it possible to set opacity in the HTML.code, or do I need to start with PHP too?


Cheers,

I'm green at html.
I designed a webpage 10years ago using html for dummies, but I have not touched it since.

Things have changed and I have forgotten, but google has helped me.
What I do struggle with is having pictures side by side and text under them.

using:
<a href="6922_13_x.jpg"><img src="6922_13_x_thumbnail.jpeg" width="335" height="282" /></a>
<a href="6969_01_x.jpg"><img src="6969_01_x_thumbnail.jpeg" width="125" height="280" /></a>
gets the thumbnails side by side, but once adding <p>text</p> they change position.

Help would be appreciated deply.

Im hoping to put a animated picture on top of a header, but not sure how... All help appreciated
Heres some of my code:
<html>
<body background="black.jpeg">
<head>
<div id="header"><h1>Faed's Money Making Guide 2009</h1></div>


<div id="links"><ul>
<li><a href="links 1.htm"></li>
Main</a>
<li><a href="mainpage.html"></li>
Introduction</a>
<li><a href="page1.html"></li>
Agility</a>
<li><a href="page2.html"></li>
Construction</a>
<li><a href="page3.htm"></li>
Cooking</a>
<li><a href="page4.htm"></li>
Crafting</a>
<li><a href="page5.htm"></li>
Farming</a>
<li><a href="page6.htm"></li>
Fletching</a>
<li><a href="mainpage.htm"></li>
Fishing</a>
<li><a href="mainpage.htm"></li>
Firemaking</a>
<li><a href="mainpage.htm"></li>
Herblore</a>
<li><a href="mainpage.htm"></li>
Hunter</a>
<li><a href="mainpage.htm"></li>
Magic</a>
<li><a href="mainpage.htm"></li>
Mining</a>
<li><a href="mainpage.htm"></li>
Prayer</a>
<li><a href="mainpage.htm"></li>
Ranging</a>
<li><a href="mainpage.htm"></li>
RuneCrafting</a>
<li><a href="mainpage.htm"></li>
Slayer</a>
<li><a href="mainpage.htm"></li>
Smithing</a>
<li><a href="mainpage.htm"></li>
Summoning</a>
<li><a href="mainpage.htm"></li>
Theiving</a>
<li><a href="mainpage.htm"></li>
Woodcutting</a>

</ul>
</div>

There are about 200 photos in a folder d:\photos\.
How to make a script to display slideshow of all photos one by one without entering each photo's name?
I found a script which displays all photos but need to input all photos' name.

Hey, did a quick search and didn't find anything,

I want to have a column of thumbnails on the left side of my page, and I'd like to have it so when a thumbnail is clicked, it loads the fullsize image into a spot to the right without having to create a new page for each image. I don't want to use frames/flash/popups.. this is possible, right? I'm working with Dreamweaver currently and know some html, but that's about the extent of my scripting knowledge.

How would I do this? Also, if I could load dynamic text below the image, that would be even better; I want to have captions to go along with each picture.

Thanks much guys-