css och asp:image-problem

[saw]

Jag har säkert klantat till det rejält, och vet inte hur jag skall lösa det snyggt.
Via en webbservice och SlideShowExtender1 så visar jag upp bilder ifrån en bestämd mapp. Det jag vill göra är att visa skugga(shadow) runt bilden.
[kod]
.skugga
{
filter:shadow(color=black);
border:thick white; padding:0.5em;border-style: ridge;
background: color:#F5F5DC;
}
//om jag försöker att använda den direkt på bilden, så syns ingen skugga.
//om jag lägger det i en div så fungerar det, men efte3rsom bilderna har lite
//olika storlek så blir det inte bra
<div style=" positionelative; left:4%; top:10px; text-align:center;margin: 0px 0px 0px 0px">
div class="skugga" style="height:225px; width:70%; ">
<asp:Image ID="Image2" ImageUrl="~/Image/Vinter/Tallgården.JPG" runat="server" CssClass="kant"
Height="220px" >
</div>
<div style="positionelative; left:-50px; top:10px;">
<aspabel ID="Label1" runat="server" Width="250px" CssClass="Titel"
Text="Tillsammans i Tillsammans..."></aspabel>
</div>
</div>
[/kod]
Jag är väldigt tacksam för förslag om förbättring här.

[voigtann1]

Sätt cssclass till "kant skugga" fungerar inte pga av? Vad har .kant för css egenskaper?

[saw]

Ber om ursäkt för att jag glömde kant
[kod]
.kant
{
border-left:3px solid #ADC2D6;
border-right:3px solid #2E5881;
border-top:3px solid #ADC2D6;
border-bottom:3px solid #2E5881;
}
[/kod]
Jag satt igår och försökte att hitta någonting på nätet, det enda som jag fann var att jag var inte ensam om att ha problem med att sätta en class på asp image...

[saw]

Jag har kommit en bit på vägen.
Jag tog bort alla referenser till skugga och till kant, gjorde en ny css
[kod]
.Image
{
filter:shadow(color=black);
border:thick white; padding:0.5em;border-style: ridge;
background: color:#F5F5DC;
padding:20px;
}
[/kod]
..och detta gjorde susen, nu får jag skuggan på bilderna som jag ville.
Men hur jag än gör, så kan jag inte centrera bilderna.
Jag har ju två divar i diven för att se till att texten kommer under bilden, det är ända anledningen, men tar jag bort de två, så ibland så lägger sig labelen till höger om bilden och det går inte att centrera.
Tips tas tacksamt imot.

[voigtann1]

CssClass är ju rätt, hur ser den genererade HTML koden ut? Sen är filter saken bara synlig i IE

[saw]

Nu har jag fått till det som jag ville. Det fodrades lite gammaldax html(table)
[kod]
<div style="positionelative; left:4%; top:10px; height:300px; width:270px; margin: 0px 0px 0px 0px">
<table><tr><td align="center">
<asp:Image ID="Image2" ImageUrl="~/Image/Vinter/Tallgården.JPG" runat="server" CssClass="Image" Height="225px" />
</td></tr><tr><td align="center">
<aspabel ID="Label1" runat="server" CssClass="Titel" Text="Tillsammans i Tillsammans..."></aspabel>
</td></tr></table>
</div>
[/kod]
En nagel i ögat:
Bilden går inte att centrer, dock så centreras texten(labelen) under bilden, så jag antar att jag får nöja mig med det...eller?

OBS.
Jag glömde.
Så här ser den genererade koden ut:
[kod]
<div style="positionelative; left:4%; top:10px; height:300px; width:270px; margin: 0px 0px 0px 0px">
<table><tr><td align="center">
<img id="ctl00_ContentPlaceHolder1_Image2" class="Image" src="Image/Vinter/Tallg%C3%A5rden.JPG"
style="height:225px;border-width:0px;" />
</td></tr><tr><td align="center">
<span id="ctl00_ContentPlaceHolder1_Label1" class="Titel">Tillsammans i Tillsammans...</span>
</td></tr></table>
</div>
[/kod]

[voigtann1]

Skall kolla på det vid en dator men om du använder tabeller för att försöka något med layout så gör du något fel


Css text-align: center på föräldern till bilden räcker väl? Om du inte ha float på bilden

Sen förstå jag inte varför du vill köra svenska klassnamn
[kod]<div style="positionelative; left:4%; top:10px; height:300px; width:270px; margin: 0px 0px 0px 0px;text-align: center">
<img id="ctl00_ContentPlaceHolder1_Image2" class="Image" src="Image/Vinter/Tallg%C3%A5rden.JPG" style="height:225px;border-width:0px;" />
<span id="ctl00_ContentPlaceHolder1_Label1" class="Titel" style="display:block">Tillsammans i Tillsammans...</span>
</div>[/kod]borde ge dig samma resultat.

[saw]

Tack voigtann1 för att du försöker men det blev inte bra.Bilderna är tagna med olika kamror och storleken kan variera. Bilden blev inte centrerad.
Dessutom labelen fär sin text ifrån bildnamnet. Jag har sparat bilderna som "I_vårsolens_glans.jpg". Innan jag visar dem, så tar jag bort extension och replaca bort "_". Detta innebär att om bilden inte är bred nog, så kan texten radbrytas.

Jag håller med dig om att table inte är bra att syssla med, men just nu så är det ända som jag har fått att fungera.
Så här ser den genererade koden ut
[kod]
<div style="positionelative; left:4%; top:10px; height:300px; width:270px;
margin: 0px 0px 0px 0px;text-align: center">
<img id="ctl00_ContentPlaceHolder1_Image2" class="Image"
src="Image/Vinter/Tallg%C3%A5rden.JPG" style="height:225px;border-width:0px;" /><p></p>
<span style="display:block"><span id="ctl00_ContentPlaceHolder1_Label1"
class="Titel">Tillsammans i Tillsammans...</span></span>
</div>

[/kod]

[voigtann1]

Jag förstå inte vad du menar med att bilder och text inte är centrerade och förstå inte heller vad du menar med filnamnet, vad kör du för doctype? Och ingen av.bilderna få ju vara större än din parent div. Skapa klassnamn och Styles till dom så är det enklare att orientera sig i din kod.

Postar gärna exempel på vilket sätt det inte fungera

[saw]

Docktypen är ingenting som jag ändrar på normalt, den genereras av Visual Studio
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Vad filnamnet är, du mäste skoja, det är ju det namnet som kopplas ihop med asp image för att det skall kunna bli en bild:
ImageUrl="~/Image/Vinter/Tallgården.JPG" denna heter alltså tallgården.jpg.
Ingen av bilderna är större än diven..
Jag skickar med två bilder (rätt och fel) så du kan förstå mig.

[voigtann1]

För de som aldrig använder vs så är det svårt att veta vad för standard doctype de kör.

Sen om de är statiska bilder dvs du använder bara aspmage för att infoga en statisk bild (dvs du pekar ut bilden) så gör inte det, är ju onödigt att servern ta upp minne för det med en server tagg.


Låt mig citera dig min fråga av om bilden:

Jag har sparat bilderna som "I_vårsolens_glans.jpg". Innan jag visar dem, så tar jag bort extension och replaca bort "_". Detta innebär att om bilden inte är bred nog

Detta fattar jag inte alls vad det har med CSS att göra, att ha med eller utan "_" spelar mindre roll, om inte bilden heter rätt och servern hittar den så bli det en bruten bild.

Såg ett fel i din css: background: color:#F5F5DC;
vet inte riktigt vad du vill göra där, color sätter typsnittet och background-color är bakgrunden. det du har i din kod är en felaktig CSS och ge dig problem förmodligen.

Jag kan inte återskapa problemet med de CSS egenskaper du delar med dig just nu:
http://jsbin.com/ijocag/edit (Om inte det är så att du är i IE och hamnar i quirks mode på din sida)?

[saw]

Ok vi kommer tydligen ingenstans så jag gör nog det lättaste för mig och behåller table.
Tack för att du försökte.