Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > aligning bg images in css - opera and ie issue

Reply
Thread Tools

aligning bg images in css - opera and ie issue

 
 
badstyle
Guest
Posts: n/a
 
      12-14-2003
i seem to have stumbled across a bit of a strange issue regardling the
positioning of BG images via CSS.

i was wandering if this was a known issue or if there are things that i can
do in order to rectify this seemingly incompatability of CSS without using
javascript or Server Side Scripting.

in this case i have a table cell with one or the other of the css below
attached to it. i want to position the BG image - which repeats - to the top
left of the table cell [background-position: 0px 0px;]. But strangely i have
to alter the vertical position by 4px for the image to visibly tile
correctly in Opera. The table cell's height is specified to be exactly the
same height has the image used for tiling.

for your reference:

---works well in OPERA 7 - but not in IE 6---

..tableT {
background-attachment: fixed;
background-image: url(../images/construction/table_T.gif);
background-repeat: repeat;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
text-transform: uppercase;
font-weight: bold;
background-position: 0px 4px;
}


---works well in IE 6 - but not in Opera 7---

..tableT {
background-attachment: fixed;
background-image: url(../images/construction/table_T.gif);
background-repeat: repeat;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
text-transform: uppercase;
font-weight: bold;
background-position: 0px 0px;
}


...b..


 
Reply With Quote
 
 
 
 
brucie
Guest
Posts: n/a
 
      12-14-2003
in post <news:brioh1$42v$(E-Mail Removed)>
badstyle said:

> i seem to have stumbled across a bit of a strange issue regardling the
> positioning of BG images via CSS.


URL?


--
brucie
15/December/2003 08:42:52 am kilo
 
Reply With Quote
 
 
 
 
badstyle
Guest
Posts: n/a
 
      12-15-2003
"brucie" <(E-Mail Removed)> wrote in message
news:brip34$3rcpa$(E-Mail Removed)-berlin.de...
> in post <news:brioh1$42v$(E-Mail Removed)>
> badstyle said:
>
> > i seem to have stumbled across a bit of a strange issue regardling the
> > positioning of BG images via CSS.

>
> URL?
>


sorry yeah!

http://www.btinternet.com/~badstyle/default-table.htm

this is the version that works fine in IE6 but has to be adjusted to work
well in Opera 7

cheers


...b..


 
Reply With Quote
 
Eric Bohlman
Guest
Posts: n/a
 
      12-15-2003
"badstyle" <(E-Mail Removed)> wrote in news:brkuv8$5fm$(E-Mail Removed):

> http://www.btinternet.com/~badstyle/default-table.htm
>
> this is the version that works fine in IE6 but has to be adjusted to work
> well in Opera 7


It doesn't render correctly in IE6 either if you engage standards mode, nor
does it render correctly in Mozilla. And the problems persist if you
comment out the links to the stylesheets. I suspect the problem is with
the nonstandard "height" attribute on the tables themselves.
 
Reply With Quote
 
badstyle
Guest
Posts: n/a
 
      12-18-2003
"badstyle" <(E-Mail Removed)> wrote in message
news:brioh1$42v$(E-Mail Removed)...
> i seem to have stumbled across a bit of a strange issue regardling the
> positioning of BG images via CSS.
>
> i was wandering if this was a known issue or if there are things that i

can
> do in order to rectify this seemingly incompatability of CSS without using
> javascript or Server Side Scripting.
>
> in this case i have a table cell with one or the other of the css below
> attached to it. i want to position the BG image - which repeats - to the

top
> left of the table cell [background-position: 0px 0px;]. But strangely i

have
> to alter the vertical position by 4px for the image to visibly tile
> correctly in Opera. The table cell's height is specified to be exactly the
> same height has the image used for tiling.
>
> for your reference:
>
> ---works well in OPERA 7 - but not in IE 6---
>
> .tableT {
> background-attachment: fixed;
> background-image: url(../images/construction/table_T.gif);
> background-repeat: repeat;
> font-family: Verdana, Arial, Helvetica, sans-serif;
> font-size: 10px;
> color: #000000;
> text-transform: uppercase;
> font-weight: bold;
> background-position: 0px 4px;
> }
>
>
> ---works well in IE 6 - but not in Opera 7---
>
> .tableT {
> background-attachment: fixed;
> background-image: url(../images/construction/table_T.gif);
> background-repeat: repeat;
> font-family: Verdana, Arial, Helvetica, sans-serif;
> font-size: 10px;
> color: #000000;
> text-transform: uppercase;
> font-weight: bold;
> background-position: 0px 0px;
> }
>
>
> ..b..
>
>


i've found that if i set the 'background-attachment:' as 'scroll' instead of
'fixed' it seems to eradicate this problem. At least this appears to be true
in my version of IE6, OPERA 7 and NN 7.1

thanks to all those who posted!


...b..


 
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
Vertically Aligning Images within a <div> Marc Bradshaw HTML 18 09-17-2008 03:35 PM
images and text not aligning tshad ASP .Net 1 09-16-2008 04:13 PM
Images and aligning UKuser HTML 1 04-12-2007 04:24 PM
Comparisons of IE, Opera and Firefox on DOM (Javascript/CSS) support(Opera wins) Bob HTML 24 05-21-2006 05:31 PM
CSS aligning two things on one line with one left and one right news.frontiernet.net HTML 6 04-16-2004 02:44 AM



Advertisments