Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Diagonal banner in corner

Reply
Thread Tools

Diagonal banner in corner

 
 
Guest
Posts: n/a
 
      07-20-2006
I know they are (supposedly) old-hat, but I was thinking of adding a
corner diagonal banner (see
http://www.exploding-boy.com/images/...s/banners.html) to a website.

Now what would need to be done so the banner fits your corner of your
css layout and not extend to the edges of your screen. E.g. If you went
to the root of the above link (http://www.exploding-boy.com/) and had
the banner going over the top left hand (or right) corner where it says
"EXP" in exploding boy i.e. top L/R corners of the white box and *not*
the top L/R corners of the blue background. (Hope this makes sense!)
Thanks


 
Reply With Quote
 
 
 
 
BlueC
Guest
Posts: n/a
 
      07-20-2006
wrote:
> I know they are (supposedly) old-hat, but I was thinking of adding a
> corner diagonal banner (see
> http://www.exploding-boy.com/images/...s/banners.html) to a website.
>
> Now what would need to be done so the banner fits your corner of your
> css layout and not extend to the edges of your screen. E.g. If you went
> to the root of the above link (http://www.exploding-boy.com/) and had
> the banner going over the top left hand (or right) corner where it says
> "EXP" in exploding boy i.e. top L/R corners of the white box and *not*
> the top L/R corners of the blue background. (Hope this makes sense!)
> Thanks
>
>


Put it inside the containing div and use

position: relative;

instead of

position: absolute;

perhaps?

http://www.w3schools.com/css/pr_class_position.asp

--
BC
 
Reply With Quote
 
 
 
 
Els
Guest
Posts: n/a
 
      07-20-2006
©® wrote:

> I know they are (supposedly) old-hat, but I was thinking of adding a
> corner diagonal banner (see
> http://www.exploding-boy.com/images/...s/banners.html) to a website.
>
> Now what would need to be done so the banner fits your corner of your
> css layout and not extend to the edges of your screen. E.g. If you went
> to the root of the above link (http://www.exploding-boy.com/) and had
> the banner going over the top left hand (or right) corner where it says
> "EXP" in exploding boy i.e. top L/R corners of the white box and *not*
> the top L/R corners of the blue background. (Hope this makes sense!)


Just place the element inside div#page and give it position:absolute.
That #page is the white box, and it already has position:relative.
If you want the banner to cover the contents of div#page (#header for
instance), then place it right before the closing </div> of div#page.


--
Els http://locusmeus.com/
 
Reply With Quote
 
Website Ribbon Website Ribbon is offline
Junior Member
Join Date: Mar 2009
Posts: 1
 
      03-13-2009
Try this free and simple website ribbon diagonal banner generator that generates a diagonal banner at the corner of a web page:
websiteribbon.com
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
How to make a diagonal gradient moondaddy ASP .Net 2 03-11-2007 08:24 PM
opening angle vertical, horizontal, or diagonal bmey@uni-mainz.de Digital Photography 14 02-24-2007 08:44 AM
Why diagonal lines on monitor screen ?? arajunk@hiwaay.net Computer Information 5 07-24-2005 04:59 AM
length of diagonal on CCD chip (1/1.7) David G Digital Photography 0 06-14-2004 02:52 PM
Re: monitor diagonal lines Luke Digital Photography 4 08-01-2003 03:00 PM



Advertisments