buti Posted January 12, 2006 Share Posted January 12, 2006 I am having a problem with a background image. I tried to make it fit my page well but problem is that it ends in the middle of the page and repeat a new one after it, in the same page. I have tried style="background-images: url('myimagedir.gif'); background: no-repeat;" it just remove it from the page. why?? and also tried height="1000>>3000" nothing happens. I am trying to display the background once in a page.please view this website and check http://www.imfuduko.com/imf_references.asp Link to comment Share on other sites More sharing options...
Mimika Posted January 12, 2006 Share Posted January 12, 2006 in the source code you are missing this code at the top of your code<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">do you use CSS ?I would suggest you did that its not hard to learn took me 1 week to learn the basics. there are a few tags that could reduce your code alittle.Like <font color="White"> <I> <b> tagsbut i suggest you to read the following tutorial for CSShttp://www.w3schools.com/css/default.asphope this helps :)and if you need help just shout BTW a nice site in did Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 yeah -- site use css but need to work on background only -- do you have any idea on how deal with it? Link to comment Share on other sites More sharing options...
Mimika Posted January 12, 2006 Share Posted January 12, 2006 ooh nicejust add a class in the tag attribute where the background image should be located and name it bgimage or what you want class="bgimage" and add this code in your externial or internal css .bgimage{ background-repeat: no-repeat; background-image:url('myimagedir.gif'); background-attachment: inherit; margin:0px; margin-top:0px;} it might help on your site Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 hi -- i have tried this part <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> hey it appears bad -- it changes standard of the page Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 Hi mimika,look at website what happenedif I can remove no-repeat it will be back to normal but that crap in the middle is giving headache ooh nicejust add a class in the tag attribute where the background image should be located and name it bgimage or what you wantclass="bgimage" and add this code in your externial or internal css .bgimage{ background-repeat: no-repeat; background-image:url('myimagedir.gif'); background-attachment: inherit; margin:0px; margin-top:0px;} it might help on your site <{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
Mimika Posted January 12, 2006 Share Posted January 12, 2006 mmhh strangehow big is your img ??you might have to add background-color: #??????;in the css code if it thouse not show over the hole site.you might have to wait until someone with more experiance in this will login and they will Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 yeah strange -- size is 149 B . it's thin in my images folder. 1 * 3885 dimensioni also tried to enlarge the hieght. what you think about it? mmhh strangehow big is your img ??you might have to add background-color: #??????;in the css code if it thouse not show over the hole site.you might have to wait until someone with more experiance in this will login and they will <{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 i hate being stuck like this -- going to make myself coffee Link to comment Share on other sites More sharing options...
Mimika Posted January 12, 2006 Share Posted January 12, 2006 nah nothing special. but the code should work. the one i gave you it worked for me.but did you try the changes in the css with the <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> ?hehe coffe all the way. its "Gods" forbidden nectar :)I take a cup later Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 check it now -- don't understandcss does work nah nothing special. but the code should work. the one i gave you it worked for me.but did you try the changes in the css with the <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> ?hehe coffe all the way. its "Gods" forbidden nectar :)I take a cup later <{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 this shows that css work because i put class="bgimage" from code in csss file .bgimage{background-repeat: no-repeat;background-image:url('images/bg.gif');background-attachment: inherit;margin:0px;margin-top:0px;}If I can remove this line background-repeat: no-repeat; it comes back to normal I know it should work -- there's somewhere we have missed check it now -- don't understandcss does work<{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
Mimika Posted January 12, 2006 Share Posted January 12, 2006 mmh no changes mmmh.can you post the codes from the css file ? Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 }BODY{ COLOR: black; FONT-SIZE: 12pt; TEXT-DECORATION: none;}.bgimage{background-repeat: no-repeat;background-image:url('images/bg.gif');background-attachment: inherit;margin:0px;margin-top:0px;}DID YOU SEE BACKGROUND LOOKS UNTIDY mmh no changes mmmh.can you post the codes from the css file ?<{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
Mimika Posted January 12, 2006 Share Posted January 12, 2006 yeah i did :Svery strange Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 phew yeah i did :Svery strange<{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
Mimika Posted January 12, 2006 Share Posted January 12, 2006 I will try too look into it Link to comment Share on other sites More sharing options...
buti Posted January 12, 2006 Author Share Posted January 12, 2006 okay thanx I will try too look into it<{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
Mimika Posted January 12, 2006 Share Posted January 12, 2006 try this i dont know if it would work but background-repeat: repeat-x;background-rcolor: #¤¤¤¤¤¤; try to find the hex value of the color at the bottom of the image Link to comment Share on other sites More sharing options...
buti Posted January 13, 2006 Author Share Posted January 13, 2006 i don't think so. because this image start with red color and end with white-smoke.is it possible to add more height at the bottom of the image and it mustn't affect it on top. i mean it must remain the same on top. try this i dont know if it would work butbackground-repeat: repeat-x;background-rcolor: #¤¤¤¤¤¤; try to find the hex value of the color at the bottom of the image <{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
Mimika Posted January 13, 2006 Share Posted January 13, 2006 if you add height the whole image in the source code that will change the size, not just the bottom. the easyest way if the css are not working like now, that i think is odd the only way now and fastest are to go into photoshop and add more height from there lets say700-1200 more in height if its possible then this problem are solved until your pages size catches up to it.or its to create a <div class="Main" align="center">[put in table in here]</div> .Main {height: 650px;width: 500px;text-decoration: none;padding-right: 20px;padding-left: 20px; } hope it works now and i suggest that you make a copy of the page if it gets cracked up its friday the 13 today Link to comment Share on other sites More sharing options...
buti Posted January 13, 2006 Author Share Posted January 13, 2006 Eish -- tried that -- it was distorted on top if you add height the whole image in the source code that will change the size, not just the bottom. the easyest way if the css are not working like now, that i think is odd the only way now and fastest are to go into photoshop and add more height from there lets say700-1200 more in height if its possible then this problem are solved until your pages size catches up to it.or its to create a <div class="Main" align="center">[put in table in here]</div> .Main {height: 650px;width: 500px;text-decoration: none;padding-right: 20px;padding-left: 20px; } hope it works now and i suggest that you make a copy of the page if it gets cracked up its friday the 13 today <{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
Mimika Posted January 13, 2006 Share Posted January 13, 2006 mmh this then ? div.Main { height: 535px; width: 100%; overflow: Auto;} add the code belllow under the <h3><b><i><u>References</u></i></b></h3> tags. right before the table tag <div class="Main" >[table in here]</div> </table>[div ending tag here]</td></tr> <tr><td><a href="imf_contactus.asp"><font size="2" color="Black"><b>Contact Imfuduko</b></font></a> today to discuss with us your next African safari.</td></tr><tr><td align="center" colspan="2"><a href="default.asp" target="_parent"><img src="images/button_home.gif" width="66" height="30" alt="" border="0"></a></td></tr></table></body></html>-----------------------------Red are the ending of the table just put the </div> where the green text are. then this should work. I for got to post the "overflow: Auto;" it will allow scrolling in the div tag i used your source code and this metod did work :)this is the last thing i can think of to solve the problem if it thouse not work, then i will wave a white flag to this problem Link to comment Share on other sites More sharing options...
buti Posted January 13, 2006 Author Share Posted January 13, 2006 no, it's not working -- thank you mimikahave a nice weekend mmh this then ?div.Main { height: 535px; width: 100%; overflow: Auto;} add the code belllow under the <h3><b><i><u>References</u></i></b></h3> tags. right before the table tag <div class="Main" >[table in here]</div> </table>[div ending tag here]</td></tr> <tr><td><a href="imf_contactus.asp"><font size="2" color="Black"><b>Contact Imfuduko</b></font></a> today to discuss with us your next African safari.</td></tr><tr><td align="center" colspan="2"><a href="default.asp" target="_parent"><img src="images/button_home.gif" width="66" height="30" alt="" border="0"></a></td></tr></table></body></html>-----------------------------Red are the ending of the table just put the </div> where the green text are. then this should work. I for got to post the "overflow: Auto;" it will allow scrolling in the div tag i used your source code and this metod did work :)this is the last thing i can think of to solve the problem if it thouse not work, then i will wave a white flag to this problem <{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
buti Posted January 13, 2006 Author Share Posted January 13, 2006 tell me do you know of setting co-ordinates for background-position, especially y-pos? no, it's not working -- thank you mimikahave a nice weekend <{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now