laxi Posted July 7, 2014 Share Posted July 7, 2014 Hi all, I am not sure why my header is not displaying the header image after using the CSS I have a png file that repeats horizotally. Please help <!DOCTYPE html><html><head><meta charset="UTF-8"><title>Wikigets The online store</title><style type="text/css">body { margin:0 px;}#pageTop {background:url(style/headerline1.png);height:110 px;}</style></head><body><div id="pageTop"> </div><div id="pageMiddle"></div><div id="pageBottom"></div></body></html> Quote Link to comment Share on other sites More sharing options...
fastsol Posted July 7, 2014 Share Posted July 7, 2014 You need single quotes for the url string url('style/headerline1.png'); Also please make sure to use the forums code tags to post code. It's the <> button under the smiley face icon. Quote Link to comment Share on other sites More sharing options...
laxi Posted July 7, 2014 Author Share Posted July 7, 2014 Hi Thank You for the reply . I tried your solution. It still does not display header. Not sure what is wrong. Is the png? Please help. You need single quotes for the url string url('style/headerline1.png'); Also please make sure to use the forums code tags to post code. It's the <> button under the smiley face icon. Quote Link to comment Share on other sites More sharing options...
laxi Posted July 7, 2014 Author Share Posted July 7, 2014 Hi Thank You for the reply . I tried your solution. It still does not display header. Not sure what is wrong. Is the png? Please help. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Wikigets The online store</title> <style type="text/css"> body { margin:0 px;} #pageTop { background: url(style/headerline1.png); height:110 px; } </style> </head> <body> <div id="pageTop"> </div> <div id="pageMiddle"></div> <div id="pageBottom"></div> </body> Hi Thank You for the reply . I tried your solution. It still does not display header. Not sure what is wrong. Is the png? Please help. Quote Link to comment Share on other sites More sharing options...
fastsol Posted July 7, 2014 Share Posted July 7, 2014 (edited) Well it surely needs the single quotes, it's not correct syntax otherwise and will surely fail for that reason. Are you sure that you have the correct path to the image? Is the image found in the style directory? you could also try the background-image: property instead of the basic background: Remember the image path in the css is relative to where the css file is located, not to the page the css file is on. Edited July 7, 2014 by fastsol Quote Link to comment Share on other sites More sharing options...
laxi Posted July 7, 2014 Author Share Posted July 7, 2014 Hi, It displays only partially in dreamweaver design mode..and absolutely nothing in any browser..what may be wrong..it is a 10x110 png file 32 bit. Quote Link to comment Share on other sites More sharing options...
fastsol Posted July 7, 2014 Share Posted July 7, 2014 Can you provide a link to the actual site and page in question so we can see what you are talking about? Quote Link to comment Share on other sites More sharing options...
laxi Posted July 7, 2014 Author Share Posted July 7, 2014 www.wikigets.com Quote Link to comment Share on other sites More sharing options...
fastsol Posted July 7, 2014 Share Posted July 7, 2014 Oh, you don't have any content in the div, so it's collapsed to nothing. If you don't have contente in a div and you want to see the background you need to give the div a height and width property. Quote Link to comment Share on other sites More sharing options...
laxi Posted July 7, 2014 Author Share Posted July 7, 2014 Oh, you don't have any content in the div, so it's collapsed to nothing. If you don't have contente in a div and you want to see the background you need to give the div a height and width property. #pageTop { background: url(style/headerline1.png); height:110 px; } the above already defines the height. It is already there in style code in my code. Do i still need to do anything? Thank You again for the response Quote Link to comment Share on other sites More sharing options...
fastsol Posted July 7, 2014 Share Posted July 7, 2014 You need a width also if there is no content. Have you actually tried putting ANYTHING in the div and see that it works. AGAIN you NEED the single or double quotes around the image path in the css. Quote Link to comment Share on other sites More sharing options...
laxi Posted July 8, 2014 Author Share Posted July 8, 2014 Still no luck, I have attached screen captures. Not able to figure out why the header is not displaying. Please edit my code if there is any issues so that png can be seen in the header. Thank you again You need a width also if there is no content. Have you actually tried putting ANYTHING in the div and see that it works. AGAIN you NEED the single or double quotes around the image path in the css. Quote Link to comment Share on other sites More sharing options...
fastsol Posted July 8, 2014 Share Posted July 8, 2014 Ahh, you can't have a space between the number and the px in your css. Must be 1000px not 1000 px. That goes for your margin above also and obviously any other css you make. Quote Link to comment Share on other sites More sharing options...
laxi Posted July 8, 2014 Author Share Posted July 8, 2014 Thank you..That fixed the issue. Ahh, you can't have a space between the number and the px in your css. Must be 1000px not 1000 px. That goes for your margin above also and obviously any other css you make. Quote Link to comment Share on other sites More sharing options...
fastsol Posted July 8, 2014 Share Posted July 8, 2014 Great, please mark this a solved if you feel your have fully resolved the issue this thread is about. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.