LebGeeks

A community for technology geeks in Lebanon.

You are not logged in.

#1 October 15 2012

abd
Member

centering an image and improving my images

hi I have the below code:

<ul id="slide"  style=" width:340px; height:480px; margin-left:2em;  vertical-align:middle;background-image: url(Images/boxframe.jpg');display:inline-table; text-align:center; " >
 <asp:Repeater runat="server" ID="repeater1">
  <ItemTemplate>
       <asp:Image ID="Image" runat="server" ImageUrl='<%# Container.DataItem %>' style="margin-left:6em; margin-top:4em"/>  
    </ItemTemplate>
 </asp:Repeater> 

I am trying to center the image inside the repeater so that it would be centered inside the ul which has a frame as a background image I tried <center></center> and display:inline but both did not work so how can I do it?

Plus I have some images of some lamps and spots.. to be added to a website to sell them online how can I improve the image quality so that it looks like a paint .. cz because my images are not good enough to be added to a website,

thanks.

Last edited by abd (October 16 2012)

Offline

#2 October 17 2012

abd
Member

Re: centering an image and improving my images

it worked:

<asp:Repeater id="repeater1" runat="server"> 
          <ItemTemplate>  
          
            
             <table><tr><td align="center" style="width:379px;height:304px;background-image: url('images/boxframe.jpg'); ">
              <asp:Image  ID="Image7"  runat="server" ImageUrl='<%#Container.DataItem %>' AlternateText="item" style="vertical-align:middle; text-align:center" ImageAlign="Middle" />
              </td></tr></table>
            
          </ItemTemplate>
       </asp:Repeater>

but does anyone know a way to improve the quality of my images so that they could be uploaded to a website, as I said before I have to add some images to my items to sell them online so I must take photos of them but how to improve the quality of those photos?

Last edited by abd (October 17 2012)

Offline

#3 October 17 2012

rtp
Member

Re: centering an image and improving my images

To center

<div style="width:300px">

    <div style="width:100px;margin:0 auto"> <!-- the trick is margin:0 auto, which actually centered the image -->
      <img src="" alt="" />
    </div>

</div>

You can't improve the quality of image you uploaded.

Last edited by rtp (October 17 2012)

Offline

#4 October 17 2012

abd
Member

Re: centering an image and improving my images

ok thank you.

Offline

#5 October 17 2012

rolf
Member

Re: centering an image and improving my images

Wow, the <center> tag! Welcome to 1999!

Offline

#6 October 17 2012

Joe
Member

Re: centering an image and improving my images

rolf wrote:

Wow, the <center> tag! Welcome to 1999!

The HTML center tag is deprecated in HTML 4.01 and obsolete in HTML 5. Learning how to use CSS (rtp's solution) is a better (although not obviously better) way.

Offline

#7 October 17 2012

rtp
Member

Re: centering an image and improving my images

by the way you should always use classes for styling or ids never write inline styling like you and i already did.
since you won't be able to overwrite it in javascript, or more acurate it would be harder and when you use class you can actually like give similar element the same class which will increase the maintaince a lot and i mean a lot!

Offline

Board footer