CSS - Is THIS Possible?

[Roy Schestowitz]

In my CSS I included the following:


#Div_png_top {
font-size: 40px;
text-align: center;
position:fixed;
top:10px;
right: 300px;
background:url(/IMG/blog_css/up.png) no-repeat top left;
width:50px;
height:50px;
}


My question is: can the line

right: 300px;

be replaced so that the object always appears in the _center_? I tried many
things to no avail.

Thanks in advance,
Roy

 

[King of Red Lions]

In my CSS I included the following:


#Div_png_top {
font-size: 40px;
text-align: center;
position:fixed;
top:10px;
right: 300px;
background:url(/IMG/blog_css/up.png) no-repeat top left;
width:50px;
height:50px;
}


My question is: can the line

right: 300px;

be replaced so that the object always appears in the _center_? I tried many
things to no avail.

Thanks in advance,
Roy

Try putting <center> and </center> tage before and after the div in your
markup!

 

[Spartanicus]

#Div_png_top {
font-size: 40px;
text-align: center;
position:fixed;
top:10px;
right: 300px;
background:url(/IMG/blog_css/up.png) no-repeat top left;
width:50px;
height:50px;
}

My question is: can the line

right: 300px;

be replaced so that the object always appears in the _center_? I tried many
things to no avail.

It can only be done properly if you set the width as a percentage of the
containing block's width, for example:

width:20%;right:40%;left:40%;

It needs to total to 100%.

 

[David Dorward]

Try putting <center> and </center> tage before and after the div in your
markup!

The center element is deprecated and should not used. It would have no
effect anyway given the CSS applied.

 

[David Dorward]

My question is: can the line
right: 300px;
be replaced so that the object always appears in the _center_?

right: 50%; /* Half the containing block */
margin-right: -25px; /* Half the width of the element */

 

[Roy Schestowitz]

Thank you David and Spartanicus for good suggestions. I didn't know
percentages were legal in CSS, but now I know they are...

Roy