PDA

View Full Version : Moving images!


dave@ag
01-20-2009, 04:08 PM
:roll: Hi all, I am having troubles with the images i use at the top of each page on my website. I have a picture that acts as a header for each page and have never had trouble with this, however recently and on different PC's, the text below the header moves on top of the header, making it look like a jumbled mess!!! I am not massively experienced with the software and presume i may need some sort of place holder somewhere???? website is www.agmotorsport.co.uk (http://www.agmotorsport.co.uk) and may or may not appear messed up (i thought it was newer browsers that caused the trouble but not so sure now!!). Any help would be greatly received :-). Ta

domedia
01-20-2009, 04:18 PM
Looks good here. Can you specify browser and which page it is so we can see the issue as well?

Welcome to the forums btw!

urbanrays
01-20-2009, 04:34 PM
Hi

Yeah the site looks messy on IE7. I think half your problem is you are using a CSS template and placing tables within the site. You need to stick to doing the site in CSS. You will have all sorts of cross browsers issues doing with tables
If you are using a free template isnt there another that may suit what you are trying to do.
Hope this helps

dave@ag
01-20-2009, 04:36 PM
Thanks ;-)

Thats the problem i have, i'm just on Internet explorer, some computers see it, others don't? :confused: On both my new Acer laptop, and my regular PC now it is happening on all pages, but is most obvious on the home page. If you can imagine the image of the yellow car staying where it is, then everything below moves up to the top of the page, overlaying the image. I can send you the Prtscreen shot if that'd help!:confused:

Thanks :grin:

dave@ag
01-20-2009, 04:58 PM
Hi

You need to stick to doing the site in CSS. You will have all sorts of cross browsers issues doing with tables


Can i do this with the site as it is?Would placing the image (headers) in tables help?:confused:

urbanrays
01-20-2009, 05:56 PM
Sorry to say this mate you need to remove the tables and start over again.
If you are new to css the best advice I can give is download about three or four different templates (where you got that one is a good site) and just play with them change different settings to see what it does and sorry to say when your sick of playing with them then play some more it will take time but you will get your head round it.

And can i just mention if you are going to start playing:-

Dont use Design view if you are using Dreamweaver it may look messy. But still work ok in the browsers
I personally have Firefox, Chrome and IE7 installed so I can check the site in the most common browsers as I go along. or use www.browsershots.org (http://www.browsershots.org)
this site is very good to start you off
//www.w3.org/Style/Examples/011/firstcss (http://www.w3.org/Style/Examples/011/firstcss)

And you really need to get your head round this before you start to understand the margins padding etc
http://www.w3.org/TR/CSS2/box.html

Hope this helps

urbanrays
01-20-2009, 06:12 PM
Someone may disagree with me here but I would personally take my navigation out of my header div.

So it looks like
<div id="container">(this is like your main table where everything goes)
<div id="header">This is where your header image or H1 go</div>
<div id="left navigation"> all your navigation links etc go here(thats if your having it on the left </div>
<div id="right content"> all the other stuff goes in here</div>
<fdiv id="footer>all your other links ie privacy sitemap etc</div>
</div>


Hope this helps mate

urbanrays
01-20-2009, 07:08 PM
if this helps to get you started just downlaod and use mate
http://www.urbanrays.co.uk/agm.htm

dave@ag
01-20-2009, 07:22 PM
Cheers guys, i'm looking to integrate an ecomerce style shop into the site so may bite the bullet and get it all done at once. Thanks your help, i'll try changing the header div tags and see how i get on!!:roll:

Cheers guys

domedia
01-21-2009, 01:55 AM
No need to change anything, urbanrays rewrote all the code for you :-)
Copy and paste ;)