Spainman Posted February 23, 2013 Share Posted February 23, 2013 (edited) Hi all, I have a designed a banner for the top part of my site. On some computers though it appears shifted to the right and completely out of place and others it appears correctly. Here is my url: http://62.81.159.230/~canicoba I have attached a screenshot showing how it appears on my pc. How can I resolve this so it appears correctly on all computer screens? Regards. Edited February 23, 2013 by Spainman (see edit history) Link to comment Share on other sites More sharing options...
smallbizwebsites Posted February 23, 2013 Share Posted February 23, 2013 It seems that your image is outside of the container it is supposed to be in. The image appears to use absolute positioning with a fixed offset from the left edge of the browser window. As a result, as the browser window is made wider, the image slides to the left while everything else stays where it is supposed to be. Your global.css file line 63 shows that this image (RCHeader6.png) is a part of the background-image property of the document body. That is why this is happening. The image needs to be inside of the <div id="header"> tags Link to comment Share on other sites More sharing options...
Spainman Posted February 24, 2013 Author Share Posted February 24, 2013 Thanks for the reply. I´m new to this, but learning quickly. Could you tell me how to get the "RCHeader6.png" image inside of the <div id="header"> tags as you mentioned. Thanks again. Link to comment Share on other sites More sharing options...
smallbizwebsites Posted February 24, 2013 Share Posted February 24, 2013 I think there would be two steps. Step 1 would be to edit the global.css file and remove the img tag for RCHeader6.png Step 2 is something a more experienced person should help you with. I would be tempted to edit the header.tpl file, but I believe this is the wrong approach. PrestaShop updates could overwrite this file. I believe the right approach is to add the image to the contents of the PrestaShop hook called {$HOOK_TOP} http://doc.prestashop.com/display/PS14/Understanding+and+using+hooks Hopefully, someone will post the best way. Link to comment Share on other sites More sharing options...
vekia Posted February 25, 2013 Share Posted February 25, 2013 well, for me your header banner looks awesome btw. Spainman, good job! I remember how your shop look like a couple of days ago, now it's brilliant Link to comment Share on other sites More sharing options...
Spainman Posted February 25, 2013 Author Share Posted February 25, 2013 Thanks a lot vekia. That is wonderful to hear! A big part of how the site looks is thanks to you and all your advice. You´ve helped me a lot On another note, regarding this post vekia, it does seem that the banner goes out of place on other peoples computers, but I dont understand why or how to fix it. Any advice? Link to comment Share on other sites More sharing options...
smallbizwebsites Posted February 25, 2013 Share Posted February 25, 2013 I think the moderator missed the essential point that the image is attached to the body background and is not inside of the container it belongs in. Therefore, if you view the site on a normal desktop computer which allows you to resize the browser window wider than the image, the image stays left-aligned while the rest of the site remains centered. Thus, the image is misplaced more and more as the browser window is made wider. Link to comment Share on other sites More sharing options...
Spainman Posted February 28, 2013 Author Share Posted February 28, 2013 Can anyone help me with this issue? As I don´t want potential clientes seeing any errors with the graphics of the site. Regards. Link to comment Share on other sites More sharing options...
.png.022b5452a8f28f552bc9430097a16da2.png)
Recommended Posts