Storlek på <div> med bildlänkar i

7 svar · 443 visningar · startad av mmmMange 25 mars 2005

mmmMangeMedlem sedan jan. 2005110 inlägg

Frågan25 mars 2005 21:18#1

Har en <div> som innehåller ett par andra <div>'ar, som i sin tur innehåller ett par bildlänkar. Problemet är att div'arna inte ändrar storlek beroende på antalet/storleken på bildlänkarna... Har satt display: block på länkarna, men det hjälpte inte...

Såhär ser det ut alltså:

Verkar som att row-divarna bara blir typ 1pixel höga och 100% breda, istället för att anpassa sig efter storleken på bilderna... Dett får till följd att thumbnails-diven också blir 100% bred, och alltså inte kan centreras (varken med <center> eller text-align: center. Kan inte ange en fast bredd på något heller, eftersom innehållet är dynamiskt, det tillkommer nya bilder och antalet bilder per rad kan ändras osv.

Så hur göra för att lösa problemet?

KarlssonMedlem sedan maj 2000252 inlägg

25 mars 2005 21:39#2

Varför inte float:a bilderna så att dom automatiskt byter rad när det inte längre finns plats?

mmmMangeMedlem sedan jan. 2005110 inlägg

25 mars 2005 21:49#3

Eftersom man skall kunna variera antalet bilder som visas på varje rad (genom en GET-parameter till ett PHP-skript) så kan de helt enkelt inte bara ligga bredvid varandra...

Men för att återgå till problemet: VARFÖR påverkas inte höjden på row-divarna av innehållet?? Det borde de väl göra...?

KarlssonMedlem sedan maj 2000252 inlägg

25 mars 2005 22:15#4

Ja, naturligtvis. Såvida du inte använder koden du visar i första inlägget.

InsiderMedlem sedan jan. 2000978 inlägg

25 mars 2005 23:09#5

Testa med en lista istället. Det blir snyggare då och du slipper säkert problemet.

HTML:
<ul>
<li><a href="#"><img src="#" /></a></li>
<li><a href="#"><img src="#" /></a></li>
<li><a href="#"><img src="#" /></a></li>
</ul>

CSS:
li {
list-style-type:none;
display:inline;
}

jarvkloMedlem sedan juli 20013 378 inlägg

27 mars 2005 20:14#6

Hmm..

Problemet måste ligga i din CSS för det är då inga problem med att få den HTML-kod du visar upp att göra som du vill ;)

Tycker det låter som om bilderna (eller något element som de ligger i) kan tänkas ligga utlagda via CSS med antingen "float" eller "position" så att de hamnar "i ett eget flöde"

Har du en länk till sidan så att man kan se hela HTML + CSS - koden ?

mmmMangeMedlem sedan jan. 2005110 inlägg

27 mars 2005 23:29#7

Här är några länkar till sidan och stilmallarna (eftersom sidan använder två stilmallar.

Sidan:
http://a-ringen59.homeip.net/photoalbum/photoalbum.php5?userid=1&layout=1

Stilmall 1 (egentligen bara .roundbox som används från denna stilmall, har jag för mig):
http://a-ringen59.homeip.net/photoalbum/css/mainstyle.css

Stilmall 2:
http://a-ringen59.homeip.net/photoalbum/css/photoalbum1.css

mmmMangeMedlem sedan jan. 2005110 inlägg

28 mars 2005 11:58#8

Kom på att jag använde en annan stilmall också, och i den hade jag satt float: left i klassen .roundbox. Men om jag tar bort float: left; så hamnar ju bilderna på varsin rad... kan man få tabeller att hamna bredvid varandra utan att använda float?