Had some questions regarding making a custom div container with images. Below is the rough idea. [IMG]http://i.imgur.com/gDutK5N.png[/IMG]
how would i go about this? here is the code i tried.
CSS:
.frameTop{ width: 500px; height: 167px; background: url(../img/topframe.png); background-repeat:no-repeat; } .frameMid{ width: 500px; background: url(../img/midframe.png); background-repeat: repeat;} .frameBot{ width: 500px; height: 48px; background: url(../img/botframe.png); background-repeat:no-repeat; }
STRUCTURE:
it kind of works but is there a better way? is this supposed to be the way to do it, if so, is there a way to use a gradient inside the box or only solid colors because having a gradient creates problems when you add content to the middle section.
thanks.
Have you thought about the border-image property?
Done in one then!
http://css-tricks.com/understanding-border-image/
interesting i will give it a try tonight, is this compatible with all browsers?
Depends on how far back you want to target.
IE...probably not but: http://caniuse.com/#search=border-image
Had some questions regarding making a custom div container with images. Below is the rough idea. [IMG]http://i.imgur.com/gDutK5N.png[/IMG]
how would i go about this? here is the code i tried.
CSS:
.frameTop{ width: 500px; height: 167px; background: url(../img/topframe.png); background-repeat:no-repeat; } .frameMid{ width: 500px; background: url(../img/midframe.png); background-repeat: repeat;} .frameBot{ width: 500px; height: 48px; background: url(../img/botframe.png); background-repeat:no-repeat; }
STRUCTURE:
it kind of works but is there a better way? is this supposed to be the way to do it, if so, is there a way to use a gradient inside the box or only solid colors because having a gradient creates problems when you add content to the middle section.
thanks.
Have you thought about the border-image property?
Done in one then!
http://css-tricks.com/understanding-border-image/
interesting i will give it a try tonight, is this compatible with all browsers?
Depends on how far back you want to target.
IE...probably not but: http://caniuse.com/#search=border-image