Runde hjørner i Internet Explorer?

Nextri

Rebel
har ikke sett den nifty corners siden, men gjør noe lunde det samme.
Kan være greit å lage det om til en php funksjon. en for start, og en for slutt, så slipper man å ha så mye html kode å holde styr på.

PHP:
	function roundboxstart(){
		$data = '
			<div class="box_round">
				<div class="round_border">
					<div class="l3"></div>
					<div class="l2"></div>
					<div class="l1"></div>
				</div>
				<div class="box_round_content">
			';
		return $data;
	}
	function roundboxend(){
		$data = '
				</div>
				<div class="round_border">
					<div class="l1"></div>
					<div class="l2"></div>
					<div class="l3"></div>
				</div>
			</div>
		';
		return $data;
	}

Kode:
.round_border div{overflow:hidden; height:1px;}
.round_border .l1{background:#F7F7F7;border-left:1px solid #C4C4C4;border-right:1px solid #C4C4C4;margin:0 0px;}
.round_border .l2{background:#EAEAEA;border-left:1px solid #C4C4C4;border-right:1px solid #C4C4C4;margin:0 1px;}
.round_border .l3{background:#C4C4C4;border-left:1px solid #C4C4C4;border-right:1px solid #C4C4C4;margin:0 2px;}
.box_round_content{background:#F7F7F7;border-left:1px solid #C4C4C4;border-right:1px solid #C4C4C4;padding:1px 0 5px;}

så er det bare å gjøre slik

PHP:
<?=roundboxstart();?>
Innhold her
<?=roundboxend();?>
 

Mr Vest

Sjefen over alle sjefer!
har ikke sett den nifty corners siden, men gjør noe lunde det samme.
Kan være greit å lage det om til en php funksjon. en for start, og en for slutt, så slipper man å ha så mye html kode å holde styr på.

PHP:
	function roundboxstart(){
		$data = '
			<div class="box_round">
				<div class="round_border">
					<div class="l3"></div>
					<div class="l2"></div>
					<div class="l1"></div>
				</div>
				<div class="box_round_content">
			';
		return $data;
	}
	function roundboxend(){
		$data = '
				</div>
				<div class="round_border">
					<div class="l1"></div>
					<div class="l2"></div>
					<div class="l3"></div>
				</div>
			</div>
		';
		return $data;
	}

Kode:
.round_border div{overflow:hidden; height:1px;}
.round_border .l1{background:#F7F7F7;border-left:1px solid #C4C4C4;border-right:1px solid #C4C4C4;margin:0 0px;}
.round_border .l2{background:#EAEAEA;border-left:1px solid #C4C4C4;border-right:1px solid #C4C4C4;margin:0 1px;}
.round_border .l3{background:#C4C4C4;border-left:1px solid #C4C4C4;border-right:1px solid #C4C4C4;margin:0 2px;}
.box_round_content{background:#F7F7F7;border-left:1px solid #C4C4C4;border-right:1px solid #C4C4C4;padding:1px 0 5px;}

så er det bare å gjøre slik

PHP:
<?=roundboxstart();?>
Innhold her
<?=roundboxend();?>

Når jeg kikker på dette så kan jeg ikke helt forstå at det er mindre og holde styr på enn ved og faktisk bruke CSS, eller roter jeg nå? Kan du fortelle hva som gjør at denne metoden faktisk gir deg mindre kode og holde styr på? Stemmer det du sier testdriver, denne metoden vil heller ikke fungere i Opera. Jeg har aldri brukt metoden som picxx nevner, men denne fungerer muligens i alle nettlesere?
 

Nextri

Rebel
Når jeg kikker på dette så kan jeg ikke helt forstå at det er mindre og holde styr på enn ved og faktisk bruke CSS, eller roter jeg nå? Kan du fortelle hva som gjør at denne metoden faktisk gir deg mindre kode og holde styr på? Stemmer det du sier testdriver, denne metoden vil heller ikke fungere i Opera. Jeg har aldri brukt metoden som picxx nevner, men denne fungerer muligens i alle nettlesere?

Du skal bruke css koden som jeg postet.
Men istedenfor at du lager 7 div tags rundt hvert element som skal ha runde hjørner, så kaller du en funksjon i php før og etter elementet ditt.
Funksjonen printer de nødvendige div'ene som gjør at du får runde hjørner.

Funksjonene inkluderer du bare en gang.
 

peterandrej

pensjonert moderator
Hvis du vil ha en idiot-sikker, men samtidig ganske enkel løsning:

Lag de runde hjørnene med bildefiler. Enkelt. Og det funker uansett nettleser og whatever. Legg et bilde på toppen og et på bunnen av en div. Enkelt.
 

Nextri

Rebel
Hvis du vil ha en idiot-sikker, men samtidig ganske enkel løsning:

Lag de runde hjørnene med bildefiler. Enkelt. Og det funker uansett nettleser og whatever. Legg et bilde på toppen og et på bunnen av en div. Enkelt.

men dette krever at alle boksene du skal lage har samme vidde.
 
Topp