[Jonathan P]

Originally posted by Syke@Aug 7 2008, 07:35
På en rad med enbart liggande bilder, ha en viss höjd på raden med bilderna centrerade i mitten (vertikalt).
På en rad med enbart stående bilder, ha en viss höjd på raden med bilderna centrerade i mitten (vertikalt).
På en rad med både stående och liggande bilder, ha en konstant höjd på raden (samma höjd som de stående bilderna + lite mellan rum). Samtidigt ha de liggande bilderna centrerade i mitten (vertikalt).

Wrappa bilderna i en container div, och sätt följande egenskaper på diven.

display: table-cell;
vertical-align: middle;

Jag har inte provat det men det borde lösa det...

[KarlRoos]

Originally posted by Syke@Aug 7 2008, 10:20
Ett annat alternativ är att ha en css-fil som genereras dynamiskt beroende på vad HTML-sidan innehåller, men det har jag inte gjort på denna site (har aldrig funderat på hur det skulle gå till överhuvudtaget).

<?php
header("Content-Type: text/css");
?>

[Syke]

Ursprungligen postat av Jonathan P

Wrappa bilderna i en container div, och sätt följande egenskaper på diven.

display: table-cell;
vertical-align: middle;

Jag har inte provat det men det borde lösa det...

Att wrappa varje bild i en div är inget alternativ, det är minst lika fel som att använda en tabell. Däremot kanske man kan göra varje LI till table-cell .. hmm ..

<!--QuoteBegin--KarlRoos[/i]
<?php
header("Content-Type: text/css");
?> [/quote]

jo, men hur inkluderar man den CSS:en i just den HTML-filen? Blir det något i stil med:

<link type="text/css" href="includes/galleryCSS.php?sammagetstringsomHTMLsidanhar" rel="stylesheet" media="screen" />

[KarlRoos]

Originally posted by Syke@Aug 7 2008, 12:31
jo, men hur inkluderar man den CSS:en i just den HTML-filen? Blir det något i stil med:

link type=text/css href=includes/galleryCSS.php?sammagetstringsomHTMLsidanhar rel=stylesheet media=screen /

That's right.

[Syke]

Ursprungligen postat av KarlRoos

That's right.

Måste testas, vi får se om det löser problemet, även om det är en ganska omständig lösning på ett litet problem

[goose]

Hej,

Jag har ett problem som jag inte lyckats lösa med div's som kanske någon av er som är duktiga på css och sånt kan lösa. Jag har en sida med tre divar bredvid varandra; left, content, right. Där left och right bara innehåller en bakgrundsbild som repeteras. Content kan vara olika hög på olika sidor, så att sätta en height funkar liksom inte. När jag kör IE så ser sidan bra ut, divarna left och right anpassar sig till rätt höjd, men i FF så ser man bara en bild, dvs bilden autoanpassas inte höjdmässigt till content. Hur fixar man detta?

[allstars]

googla på faux columns

snabbt förklarat så har man en bakgrundbild i föräldradivven (wrapper) till dina tre övriga divvar.

<div id="wrapper">
<div id="left">innehålll</div>
<div id="middle">innehålll</div>
<div id="right">innehålll</div>
</div>

[goose]

aha, så istället för att dela upp sin bakgrund i tre delar left.jpg, content.jpg och right.jpg, så gör man en bg.jpg som är lika bred som själva sidan och sen kör man den i wrapper? kanonsmart, tack för hjälpen.

[allstars]

spot on!

[Robert]

Folk som nämner "semantisk html" och "div" i samma mening inser knappast tankevurpan.

Folk som tycker "css" är motsatsen till "tabeller" har också en läxa att läsa på.

Html (eller snarare xhtml) och css ska ses som två lager: en databärare och ett presentationslager. Att jämföra dessa är som att jämföra äpplen och päron. Och för de som är för semantiskt korrekt html och ser på detta som en religion vet att dom samtidigt måste vara otrogna varje gång de designar en sida då de använder exempelvis div'ar ENDAST i layoutsyfte, dvs de styr layouten från html-koden. Detta är ju den begränsning vi alla får leva med då CSS i dagsläget inte klarar av att helt axla ansvaret att sköta all layout. En sann databärare är ju XML, men det är inte det lättaste att få till snyggt på en klient...

Tills den dagen kommer så får vi stå ut med en soppa av nästlade div'ar blandat med semantisk korrekt html. För mig skulle dessa div'ar lika gärna kunna vara en tabell, det är liksom lika fel, men jag håller mig till containrar av modellen div då jag tror på framtiden...