StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POWhy do my pictures in a asp image control look squashed?
primarykey
Id
13362266
data
AcceptedAnswerId
13428809
AnswerCount
2
ClosedDate
CommentCount
4
CommunityOwnedDate
CreationDate
2012-11-13T14:13:27.393
FavoriteCount
1
LastActivityDate
2012-11-17T07:58:13.750
LastEditDate
2012-11-13T15:09:57.233
LastEditorUserId
1757772
OwnerUserId
1757772
ParentId
0
PostTypeId
1
Score
1
ViewCount
398
LastEditorDisplayName
text
Body
<p>I have an asp.net c# web page. On the page I have a image box which will randomly display an image every 5 secs or so. The problem is, some of the pictures appear squashed. All of the pictures have been cropped in photoshop to 350x350 pixels and the size of the image box is 350x350 pixles. If you look at the pictures using another program they look fine, but on the asp.net page they look funny. Can someone show me where I'm going wrong?</p> <p>Thanks, Craig</p> <p>here's the source code rendered in IE, but it looks nothing like what I have in my asp.net default page.</p> <pre><code><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head><title> Home Page </title><link href="Styles/Site.css" rel="stylesheet" type="text/css" /> </head> <body> <form method="post" action="Default.aspx" id="ctl01"> <div class="aspNetHidden"> <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" /> <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" /> <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE5NTc5Mjg4MDYPZBYCZg9kFgICAw9kFgICAw9kFgICAw8WAh4HRW5hYmxlZGdkZESHdPrJrv0fd90yot44IdP2LuG176cv2XyHWiPVlPSh" /> </div> <script type="text/javascript"> //<![CDATA[ var theForm = document.forms['ctl01']; if (!theForm) { theForm = document.ctl01; } function __doPostBack(eventTarget, eventArgument) { if (!theForm.onsubmit || (theForm.onsubmit() != false)) { theForm.__EVENTTARGET.value = eventTarget; theForm.__EVENTARGUMENT.value = eventArgument; theForm.submit(); } } //]]> </script> <script src="/WebResource.axd?d=DogTP9ciF8js-919lyE5BNUR3gLIy6vQ94IA8ujQqufPbSjgjYs-MB8TFhgGkZbCezg2T7MihOn_QzXNJh8bUbKXvUZPuDq-Zo79nPbUosQ1&amp;t=634856347325009875" type="text/javascript"></script> <script src="/ScriptResource.axd?d=4jTc4W6vHbFONhMZfZEniQ0ll2ox3vAxSkMzYB-7HtakDqsmhXCZFBXSRwOb1nRWK6CMzP0qyRYdnYMNnTFXhx2r0J9E2ik7kM8XVmq_UBEPDXqK-kLCJqvRQAvq0wv0ZlWQS1gCjlQxcxLhV1XrJQ2&amp;t=150492e7" type="text/javascript"></script> <script src="/ScriptResource.axd?d=GHu6blHeASt9skHbsJx4uFWYiLKvlA8B1V1ZT8jJM7xJFl3ycZATlv3IHRrGJMm_fpPlBSBh8s1B1E7r9viSf2_vG2Xab8vHZGZqr8izsLUD5pjhbTenZ9dImmZEGONdwrT5ungX3KYzAap2ByhMGQe1RCN4HIeWzLfx9QPaNIL_dFC2Su5ez5Ui0Ux0TCBs0&amp;t=ffffffff940d030f" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ if (typeof(Sys) === 'undefined') throw new Error('ASP.NET Ajax client-side framework failed to load.'); //]]> </script> <script src="/ScriptResource.axd?d=k0ZMcbO229cP7tJHdqfAeLLkubS_PB3nLJRGVfbZzo992j-U0QXogHZ9AeLO7yXzYa70OSzRIw-wnFwxHbCbmy30q_MrEaY-iqOTNAQzXLCt0hz--HUsMHJsrrht6bk34EjhwJc7bL5h2KjWTMIm5sDlaERrkzNMJ2CYN7WaxPRUTRyOkbTPleHmC1PMtedi0&amp;t=ffffffff940d030f" type="text/javascript"></script> <script src="/ScriptResource.axd?d=7Pyyv_WcNl6DPXEjw9wnwQXSTOHSqlXve9fO2VxG4I-t0REk8QlK5V7QxKS7jkGO1CGno7PDXkPN1ApWod5KVH--pObLgj1ukjWVTcpKZZNJKm_Fz0qDQd_RVd2qBcBGOEo0qqVjh1A8QaUZNRMFCx12FzcYFbkEV_4FAwoZHekJoj0b0U3QdytSO2iP-U-F0&amp;t=ffffffff940d030f" type="text/javascript"></script> <div class="page"> <div class="header"> <div class="title"> <h1> My Family Web Site </h1> </div> <div class="clear hideSkiplink"> <a href="#NavigationMenu_SkipLink"><img alt="Skip Navigation Links" src="/WebResource.axd?d=CEw_ah6x15SB8gE6w0h-5pVp-C_glYrwEoXIAM74CoVRv4LUELJEQWVkcLYtMPI0-_6jQVupgDDSAEIK43VxSf5HH-tcHYeqNWJ2d0U1yuU1&amp;t=634856347325009875" width="0" height="0" style="border-width:0px;" /></a><div class="menu" id="NavigationMenu"> <ul class="level1"> <li><a class="level1" href="Default.aspx">Home</a></li><li><a class="level1" href="About.aspx">About</a></li><li><a class="level1" href="Daniel.aspx">Daniel</a></li> </ul> </div><a id="NavigationMenu_SkipLink"></a> </div> </div> <div class="main"> <h2> Welcome To The Smith Family Web Site</h2> <p> Here you can find out all of the great things going on at the homestead. </p> <script type="text/javascript"> //<![CDATA[ Sys.WebForms.PageRequestManager._initialize('ctl00$MainContent$ScriptManager1', 'ctl01', ['tctl00$MainContent$UpdatePanel1','MainContent_UpdatePanel1'], ['ctl00$MainContent$Timer1','MainContent_Timer1'], [], 90, 'ctl00'); //]]> </script> <div class="picture"> <span id="MainContent_Timer1" style="visibility:hidden;display:none;"></span> <div id="MainContent_UpdatePanel1"> <img id="MainContent_Image1" src="Pictures/25.JPG" align="middle" style="height:350px;width:350px;" /> </div> </div> </div> <div class="clear"> </div> </div> <div class="footer"> </div> <script type='text/javascript'>new Sys.WebForms.Menu({ element: 'NavigationMenu', disappearAfter: 500, orientation: 'horizontal', tabIndex: 0, disabled: false });</script> <script type="text/javascript"> //<![CDATA[ Sys.Application.add_init(function() { $create(Sys.UI._Timer, {"enabled":true,"interval":1500,"uniqueID":"ctl00$MainContent$Timer1"}, null, null, $get("MainContent_Timer1")); }); //]]> </script> </form> </body> </html> </code></pre> <p>Here's the code in my asp.net page:</p> <pre><code><%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="FamilyWebSite._Default" %> <asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> </asp:Content> <asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> <h2> Welcome To The Smith Family Web Site</h2> <p> Here you can find out all of the great things going on at the homestead. </p> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <div class="picture"> <asp:Timer ID="Timer1" runat="server" ontick="Timer1_Tick" Interval="1500"> </asp:Timer> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <Triggers> <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" /> </Triggers> <ContentTemplate> <asp:Image ID="Image1" runat="server" ImageUrl="~/Pictures/25.JPG" Width="350px" Height="350px" ImageAlign="Middle" /> </ContentTemplate> </asp:UpdatePanel> </div> </asp:Content> </code></pre> <p>here's the Site.css as well</p> <pre><code>/* DEFAULTS ----------------------------------------------------------*/ body { background: #b6b7bc; font-size: .80em; font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; margin: 0px; padding: 0px; color: #696969; } a:link, a:visited { color: #034af3; } a:hover { color: #1d60ff; text-decoration: none; } a:active { color: #034af3; } p { margin-bottom: 10px; line-height: 1.6em; } /* HEADINGS ----------------------------------------------------------*/ h1, h2, h3, h4, h5, h6 { font-size: 1.5em; color: #fff; font-variant: small-caps; text-transform: none; font-weight: 200; margin-bottom: 0px; text-align: center; } h1 { font-size: 3em; padding-bottom: 0px; margin-bottom: 0px; text-align: center; } h2 { font-size: 1.5em; font-weight: 600; } h3 { font-size: 1.2em; } h4 { font-size: 1.1em; } h5, h6 { font-size: 1em; } p { color: #fff; } /* this rule styles <h1> and <h2> tags that are the first child of the left and right table columns */ .rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2 { margin-top: 0px; } /* PRIMARY LAYOUT ELEMENTS ----------------------------------------------------------*/ .page { width: 960px; min-height: 800px; background-color: #778899; margin: 20px auto 0px auto; border: 2px solid #787878; } .header { position: relative; margin: 2px; padding: 0px; background: #ccc; width: auto; text-align: center; border: 2px ridge #787878; } .header h1 { width: auto; font-weight: 700; margin: auto; padding: 4px 4px 4px 4px; color: Olive; border: none; line-height: 2em; font-size: 2em; text-align: center; background: #000; } .main { padding: 0px 12px; margin: 12px 8px 8px 8px; min-height: 420px; } .leftCol { padding: 6px 0px; margin: 12px 8px 8px 8px; width: 200px; min-height: 200px; } .footer { color: #4e5766; padding: 8px 0px 0px 0px; margin: 0px auto; text-align: center; line-height: normal; } /* TAB MENU ----------------------------------------------------------*/ div.hideSkiplink { background-color:Olive; width:100%; } div.menu { padding: 4px 2px 2px 2px; } div.menu ul { list-style: none; margin: 0px; padding: 0px; width: auto; } div.menu ul li a, div.menu ul li a:visited { background-color: #465c71; border: 1px #4e667d solid; color: #dde4ec; display: block; line-height: 1.35em; padding: 4px 20px; text-decoration: none; white-space: nowrap; } div.menu ul li a:hover { background-color: #000; color: #465c71; text-decoration: none; } div.menu ul li a:active { background-color: #465c71; color: #cfdbe6; text-decoration: none; } /* FORM ELEMENTS ----------------------------------------------------------*/ fieldset { margin: 1em 0px; padding: 1em; border: 1px solid #ccc; } fieldset p { margin: 2px 12px 10px 10px; } fieldset.login label, fieldset.register label, fieldset.changePassword label { display: block; } fieldset label.inline { display: inline; } legend { font-size: 1.1em; font-weight: 600; padding: 2px 4px 8px 4px; } input.textEntry { width: 320px; border: 1px solid #ccc; } input.passwordEntry { width: 320px; border: 1px solid #ccc; } div.accountInfo { width: 42%; } /* MISC ----------------------------------------------------------*/ .clear { clear: both; } .title { display: inline-block; /*float: left;*/ text-align: center; width: auto; border: 2px groove #fff; padding: 2px 2px 2px 2px; margin: 2px 2px 2px 2px; } .loginDisplay { font-size: 1.1em; display: block; text-align: right; padding: 10px; color: White; } .loginDisplay a:link { color: white; } .loginDisplay a:visited { color: white; } .loginDisplay a:hover { color: white; } .failureNotification { font-size: 1.2em; color: Red; } .bold { font-weight: bold; } .submitButton { text-align: right; padding-right: 10px; } .picture { padding: 2px; margin: 5px; border: 3px ridge #fff; height: auto; width: inherit; float: left; } </code></pre>
Tags
<c#><asp.net><image>
Title
Why do my pictures in a asp image control look squashed?
singulars
PostAcceptedAnswerId
1. PO
  singulars
  PostTypePostTypeId
  PTAnswer
PostParentId
1. This table or related slice is empty.
PostTypePostTypeId
1. PTQuestion
UserLastEditorUserId
1. USCraig Smith
UserOwnerUserId
1. USCraig Smith
plurals
PostLinksPostIdRelatedPostId
1. This table or related slice is empty.
PostLinksRelatedPostIdPostId
1. This table or related slice is empty.
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. PO
  singulars
  PostTypePostTypeId
  PTAnswer
2. PO
  singulars
  PostTypePostTypeId
  PTAnswer
VotesPostIdCreationDate
1. VO
  singulars
  PostPostId
  POWhy do my pictures in a asp image control look squashed?
  UserUserId
  This table or related slice is empty.
  VoteTypeVoteTypeId
  VTUpMod
2. VO
  singulars
  PostPostId
  POWhy do my pictures in a asp image control look squashed?
  UserUserId
  USCraig Smith
  VoteTypeVoteTypeId
  VTFavorite
CommentsPostId

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.