webForumDet fria alternativet

Dynamisk width på div

4 svar · 290 visningar · startad av tovelainen

tovelainenMedlem sedan mars 2003143 inlägg
#1

Hej!
Jag har gjort en fotosajt som ser jättebra ut med Mozilla och IE.
På sidan blandas stående och liggande bilder.

Nu har jag hört att sidan blir ful när det är liggande bilder på Mac (Safari tror jag) och nu ser jag själv felet på min PC om jag kollar via Opera.

Jag har en bild-div.
I den ska en bild ligga. Man klickar fram och får se nästa.
Är det en stående bild ser det bra ut.
Vit ram sluter tätt kring bilden och ger en fin vit ram på 10px.
När det sen dyker upp en liggande bild så kryper den ur rutan och den vita ramen följer inte dynamsikt med.

Ni fattar när ni ser css:en:

.bild {
text-align:center;
margin-top:10px;
border: 10px solid white;
background: white;
width:300px;
}

När man kollar i IE och det är liggande bild som är 500px i width, så följer ramen dynamiskt med och sväller ut och blir 500.
I Opera (och då antagligen Safari) finns inte denna dynamik. Vidden på diven är fortfarande 300 och bilden sticker liksom ur sin box.

Hur gör jag för att få bild-diven att bli så stor som bilden är (dvs antingen 300 eller 500 bred)
Antar att det inte gör nån skillnad om jag skriver overflow:visible. Bilden fortsätter väl att synas med diven fortsätter va 300px.

Duger inte heller med min-width eller max-width eftersom rutan då sväller ut och blir max-bred, vilket råkar va 520px som den får av diven som denna div ligger i.

Jösses....vilken omständig förklaring... förstår ni?? :-))
Hej från Tove

zcorpanMedlem sedan dec. 20042 269 inlägg
#2

Om jag inte missuppfattat dig helt så borde du kunna ändra width:300px till min-width:300px...

tovelainenMedlem sedan mars 2003143 inlägg
#3

Hallå!
Nä tyvärr funkar inte det för då sväller den ut och blir max-bred, dvs när det är stående bilder så blir det vita kanter som är jättebreda på sidorna.
Tack ändå. Nåt annat förslag?

mozillaMedlem sedan juli 20011 202 inlägg
#4

Hej,
Ja... varför har du en bild-div? Du behöver ju inte skapa ett nytt "markup language" med divvar. ;) Du bör ju kunna lägga bordern och marginaler osv direkt på bilden?

tovelainenMedlem sedan mars 2003143 inlägg
#5

Hej igen
Jo det blev sådär struligt för att koden eg såg ut såjhär:

<a href="" class="bild">{image}</a>

Dvs "image" var en variabel eller hur det nu heter. Men såklart kunde jag ju hitta var variabeln skrivs ut och tack vare din fråga såg jag det absurda i att gå omvägar, så jag letade upp rätt ställe o ändrade direkt på bilden genm att lägga till inline-style.

Tackar!

Genererad på 382 ms · cache AV · v20260730165559-full.f96bc7eb