Kan jeg bruke bilde som border?

[realfingolfin]

Kan jeg det? altså på divs og tabeller, kan jeg bruke en del av et bilde helst hele (slik at 1/4 vises på hver av borderne)

 

Er det mulig?

[Loomy]

Hvis jeg forstod deg rett KAN du lage en egen border-div som er like bred som du vil at borderen skal være, og så sette bildet som bakgrunnsbilde i div'en. Hvilken del av bildet som vises kan bestemmes med background-position. Men uansett blir det fryktelig innviklet å plassere 4 div'er inni en div

[Equerm]

Du kan jo vel bruke samme metoden som de fleste bruker på å lage en "border" på hele siden, hva skal du bruke det til da?

[Arve Systad]

http://absentvoid.com/hwno/dynamic_custom_borders/

[Equerm]

http://absentvoid.com/hwno/dynamic_custom_borders/

Var det ikke noe bug med den i FF?

[Cucum(r)]

Dette blir mye lettere i CSS3, for da får vi egenskapen border-image

 

Edit

Ja, det dokumentet er bare en Working Draft, men det er jo hele CSS3-spesifikasjonen. border-image er en ganske prioritert egenskap, etter hva jeg har hørt.

Endret 18. oktober 2004 av SirIce

[realfingolfin]

http://absentvoid.com/hwno/dynamic_custom_borders/

Den linken hjalp meg litt, men kan du vie meg hvilket del av koden jeg trenger? jeg brukte vis kilde-tingen men jeg skjønner det fortsatt ikke.

 

Så det duger bare med:

 

#top_stretch {
width: 100%;
background: url(images/top_stretch.gif) repeat-x;
height: 20px;
}

#top_left {
width: 20px;
height: 20px;
background: url(images/top_left.gif);
float: left;
}

#top_right {
width: 20px;
height: 20px;
background: url(images/top_right.gif);
float: right;
}

#content {
background: url(images/left_stretch.gif) repeat-y left;
}

#content p {
font-family: sans-serif;
padding: 0 30px 0 30px;
}

#bottom_stretch {
width: 100%;
background: url(images/bottom_stretch.gif) repeat-x;
height: 20px;
}

#bottom_left {
width: 20px;
height: 20px;
background: url(images/bottom_left.gif);
float: left;
}

#bottom_right {
width: 20px;
height: 20px;
background: url(images/bottom_right.gif);
float: right;
}

 

Og hvordan blir htmlen? <div> og så <div> inni <div>, er det mulig?

[Equerm]

<div id="main">
<!-- START ØVERSTE LINJE MED BORDERS/HJØRNER -->
<div id="top_stretch">
 <div id="top_left"></div>
 <div id="top_right"></div>
</div>
<!-- INNHOLDSFELT -->
 <div id="content">
 
   <p> Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
     Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
     when an unknown printer took a galley of type and scrambled it to make a 
     type specimen book. It has survived not only five centuries, but also the 
     leap into electronic typesetting, remaining essentially unchanged. It was 
     popularised in the 1960s with the release of Letraset sheets containing 
     Lorem Ipsum passages, and more recently with desktop publishing software 
     like Aldus PageMaker including versions of Lorem Ipsum.</p>
 </div>
 
 	<!-- START BUNNLINJE MED BORDERS/HJØRNER -->
<div id="bottom_stretch">
 <div id="bottom_left"></div>
 <div id="bottom_right"></div>
</div>


</div>

 

Den var der..

[Loomy]

Dette blir mye lettere i CSS3, for da får vi egenskapen border-image

 

Edit

Ja, det dokumentet er bare en Working Draft, men det er jo hele CSS3-spesifikasjonen. border-image er en ganske prioritert egenskap, etter hva jeg har hørt.

...men så kommer det jo til å ta 8-9 år før Internet Explorer støtter den, så..

[toss]

Dette blir mye lettere i CSS3, for da får vi egenskapen border-image

 

Edit

Ja, det dokumentet er bare en Working Draft, men det er jo hele CSS3-spesifikasjonen. border-image er en ganske prioritert egenskap, etter hva jeg har hørt.

når kommer CSS3?

[Arve Systad]

Og hvordan blir htmlen? <div> og så <div> inni <div>, er det mulig?

Ja, det går fint an med div inni div

 

Men boksen i tilfellet eg viste til er jo dynamisk, og har strengt tatt veldig masse fleire bilder og kode enn nødvendig for en med statisk bredde.

 

For en med statisk bredde trenger du følgande:

<div id="boks"> <!-- Denne boksen gir du bakgrunnen som må strekke seg nedover -->
<div id="top"></div> <!-- Denne boksen gir du bakgrunnsbildet som skal vere toppen av boksen, dei øverste borderane, pluss hjørner oppe -->

<!-- Her kommer innholdet i boksen. Boksen vil med denne metoden strekke seg nedover etterkvert som innholdet blir lengre. Går dog ikkje særlig bra om du angir bredde på blokkelementer til å bli større enn bredden på boksen. -->

<div id="bottom"></div> <!-- Samme som toppen, men med bunn-borders -->

 

Skjønner?

[realfingolfin]

Og hvordan blir htmlen? <div> og så <div> inni <div>, er det mulig?

Ja, det går fint an med div inni div

 

Men boksen i tilfellet eg viste til er jo dynamisk, og har strengt tatt veldig masse fleire bilder og kode enn nødvendig for en med statisk bredde.

 

For en med statisk bredde trenger du følgande:

<div id="boks"> <!-- Denne boksen gir du bakgrunnen som må strekke seg nedover -->
<div id="top"></div> <!-- Denne boksen gir du bakgrunnsbildet som skal vere toppen av boksen, dei øverste borderane, pluss hjørner oppe -->

<!-- Her kommer innholdet i boksen. Boksen vil med denne metoden strekke seg nedover etterkvert som innholdet blir lengre. Går dog ikkje særlig bra om du angir bredde på blokkelementer til å bli større enn bredden på boksen. -->

<div id="bottom"></div> <!-- Samme som toppen, men med bunn-borders -->

 

Skjønner?

aha

[realfingolfin]

...men så kommer det jo til å ta 8-9 år før Internet Explorer støtter den, så.. 

 

Støtter opera css3? bare lurer på det så jeg får testet det ut eller et css3 et prosjekt som ikke har gått "live" ennå?

[Loomy]

CSS3 er fremdeles i "utviklingsfasen" for å si det sånn, men jeg tror f.eks Firefox allerede har støtte for en brøkdel av tingene Vet ikke hvilke tho'

[realfingolfin]

CSS3 er fremdeles i "utviklingsfasen" for å si det sånn, men jeg tror f.eks Firefox allerede har støtte for en brøkdel av tingene Vet ikke hvilke tho'

Hmm...Når kommer css3 til å gå live da? håper det er før jeg blir 20 år lol.