Hi guys,
I'm sort of stumped on this one
I'm sure it's a real simple fix. If you go to the following URL you'll see that I have the image of the car as a background of a container. You can clearly see that it looks like the image is being cut off or cropped by the right edge, due to the positioning.
I like where it's positioned, but is there any way to make that part of the image that's cropped off appear outside of its container? My question make sense?
This seems to be happening in all browsers. I'm sure it has something to do with relative positioning.
<!-- m --><a class="postlink" href="http://www.z50racing.com/temp/test/">http://www.z50racing.com/temp/test/</a><!-- m -->
Any help's appreciated. Thanks!An alternative (unchecked in IE) would be to put the bg on the html and the car on the body, positioned 90% 95.7%.Actually Ray, I did just that before. But in IE the bg image doesn't tile for the HTML element. It only displays the background (orange) color.
Any more ideas??
Anyone?well. ...
Your container is 700 wide and that car pic, (which looks pretty cool btw) is 650px wide.
You have in your css placed that car 130px to the right so no wonder why it crops of
My suggestion is to replace "130" to "right" instead, so the bg car pic will be glued to the right
cheersRemove the car from the background and position it absolute:
<div id="container">
<div id="content" style="width: 500px; border: 1px solid #fff;">
<img style="position:absolute;top:340px;left:130px;" alt="" src=http://www.webdeveloper.com/forum/archive/index.php/"home_car.jpg">
{CONTENT WILL BE GOING IN HERE}
</div>
</div>Thanks, Fang.
It looks like it may work... I would only need to make some adjustments--I may need to slice the image and place it partially in the the background so as to not cover up the content.
Thanks, everyone.
Hi -
I'd stick w/ the background image but use %, like:
background:#hexcolor url("images/imagename.ext") no-repeat 0% 100%;
Experiment w/ the two values 'til you get it where it needs to be...distance is relative to the container element the style is placed onto.
Good luck,
ElThanks, LJK...
I did stick with leaving the image in the background. BUT that part that gets cut off I simply made it its own image and simply positioned it absolutely.
Look for the official site to be up soon (albeit, relying on some tables for layout). <!-- w --><a class="postlink" href="http://www.z50racing.com">www.z50racing.com</a><!-- w -->
Thanks!aha so that纾
I'm sort of stumped on this one
I'm sure it's a real simple fix. If you go to the following URL you'll see that I have the image of the car as a background of a container. You can clearly see that it looks like the image is being cut off or cropped by the right edge, due to the positioning.
I like where it's positioned, but is there any way to make that part of the image that's cropped off appear outside of its container? My question make sense?
This seems to be happening in all browsers. I'm sure it has something to do with relative positioning.
<!-- m --><a class="postlink" href="http://www.z50racing.com/temp/test/">http://www.z50racing.com/temp/test/</a><!-- m -->
Any help's appreciated. Thanks!An alternative (unchecked in IE) would be to put the bg on the html and the car on the body, positioned 90% 95.7%.Actually Ray, I did just that before. But in IE the bg image doesn't tile for the HTML element. It only displays the background (orange) color.
Any more ideas??
Anyone?well. ...
Your container is 700 wide and that car pic, (which looks pretty cool btw) is 650px wide.
You have in your css placed that car 130px to the right so no wonder why it crops of
My suggestion is to replace "130" to "right" instead, so the bg car pic will be glued to the right
cheersRemove the car from the background and position it absolute:
<div id="container">
<div id="content" style="width: 500px; border: 1px solid #fff;">
<img style="position:absolute;top:340px;left:130px;" alt="" src=http://www.webdeveloper.com/forum/archive/index.php/"home_car.jpg">
{CONTENT WILL BE GOING IN HERE}
</div>
</div>Thanks, Fang.
It looks like it may work... I would only need to make some adjustments--I may need to slice the image and place it partially in the the background so as to not cover up the content.
Thanks, everyone.
Hi -I'd stick w/ the background image but use %, like:
background:#hexcolor url("images/imagename.ext") no-repeat 0% 100%;
Experiment w/ the two values 'til you get it where it needs to be...distance is relative to the container element the style is placed onto.
Good luck,
ElThanks, LJK...
I did stick with leaving the image in the background. BUT that part that gets cut off I simply made it its own image and simply positioned it absolutely.
Look for the official site to be up soon (albeit, relying on some tables for layout). <!-- w --><a class="postlink" href="http://www.z50racing.com">www.z50racing.com</a><!-- w -->
Thanks!aha so that纾