Getting there, slowly but surely....

Associate
Joined
28 Dec 2002
Posts
2,400
Location
Northern Ireland
Hi Guys,
First off thakns for all your help in previous posts about my problems in setting up my website.

I have now changed to css to put everything in order and keep everything the same no matter what resolution is set.

The problem now is i have an image on the first page of my website. The problem is i can see it fine in firefox but not in internet explorer??

Why is this?

Here is the css code:
/* CSS Document */
body{
background: url(../images/background.jpg);
margin: 0px;
color: #000000
font-family:Calibri;
font-size:12px
}
#container {
position:relative;
width:800px;
margin:auto;
}
div.imageholder{
position:absolute;
width:424px;
height:544px;
left:376px;
top:100px;
}
div.navigation{
position:absolute;
width:200px;
height:444px;
left:800px;
top:120px;
z-index:5;

line-height:30px;
font-family:Calibri;
font-size:18px;
color:;
}
.style {
color:#FF9900;
font-weight:bold;
{
a.navigation:link{
color:#000000;
text-decoration:none;
}
a.navigation:visited{
text-decoration:none;
color: #660066;
}
a.navigation:hover{
text-decoration:none;
color:#FFFF33;
}
a.navigation:active{
text-decoration:underline;
color:#FFFF33;
}
div.contentarea {
position:absolute;
width: 600px;
height: 300px;
left: 50px;
top: 50px;
font:13px;
text-align:justify;
}

Thanks for your help, yet again
 
oh and sorry another one is that in internet explorer the text area is in the correct place, positioned away from the sides and top but in firefox its not??
 
this is reall frustrating i cannot see any text i put on my website.

When i code it in dreamweaver and press F12 to preview it works fine, but when i upload it via ftp and go to it live via my main domain name it doesnt work.

really getting frustrated with it.

any help guys would be great
 
ace2109 said:
The problem now is i have an image on the first page of my website. The problem is i can see it fine in firefox but not in internet explorer??

i think the problem is the following part, im not going to say exactly what but see if you can find it yourself.

Code:
<div class="imageholder"<img src="images/desktoppc.jpg" alt="Desktop PC"/></div>

have a try fixing this and i will look into the text thing now

[edit]
im not seeing the problem with the text thing, it might be down to the mistake above that there is text missing but i can see all the text that is written in the html
 
Last edited:
Mammalian said:
i think the problem is the following part, im not going to say exactly what but see if you can find it yourself.

Code:
<div class="imageholder"<img src="images/desktoppc.jpg" alt="Desktop PC"/></div>

have a try fixing this and i will look into the text thing now

[edit]
im not seeing the problem with the text thing, it might be down to the mistake above that there is text missing but i can see all the text that is written in the html

Should it look like this?
<div class="imageholder"> <img src="images/desktoppc.jpg" alt="Coffee" /></div></div>
 
ace2109 said:
no mate,
i still cant see any css information in internet explorer???

can you?

im a little lost, did you want the below code to be shown on the webpage?

Code:
<style type="text/css">
.style4 {
            font-size: 24px;
            color: #FF6600;
			font-family:Calibri;
}
</style>

if so it wont be showing as its code, so it would be like typing <div> which wouldn't show.

try putting it in either:

<pre> text here </pre>
or
<textarea> text goes here </textarea>

not sure how each of them work in depth but textarea is used to show code but it will display it with only one white space, and pre is used to display whatever you want and display in the way it is written, e.g. with all the white space.

did this help?
 
sorry mate the problem with this is i have made a css file for this text but it is not responding to any of the change i make.

css code:
div.contentarea{
position:relative;
width: 37px;
height: 3px;
left: 17px;
top: 21px;
font:11px;
text-align:justify;
}

html code:
<div class="contentarea">
<p><span class="style4">Welcome to PC Super Geeks</span>
<p>PC Super Geeks, is a newly established Company aiming to help you get the most out of your PC at home or in the office</p>
</div>
<style type="text/css">
.style4 {
font-size: 24px;
color: #FF6600;
font-family:Calibri;
}
</style>
</body>
</html>

So really what should happen here is the text i type in should be out from the left hand side and down a bit from the top. But this is not happening
 
ahh i see now. Instead of usuing position:relative, try using margins or padding,

e.g. margin-left: 10px; margin-top: 5px; etc

if you are doing more then a couple you could also write it as:

margin: 5px 0 0 10px;, which reads top right bottom left, like a clock. so 5px top, 0px right etc. Make sense?

you will also find that each browser has differnt padding/margin settings so you will need to add a hack for it. there are other ways of doing it but i prefer to use the following:

write the code for firefox, e.g. like above, then when its in the right place, go look at it in ie6/7 and then add extra margin settings below the firefox ones that only ie will read. for example


margin-top: 5px;
margin-left: 10px;
_margin-left: 5px;

the _ before the code means only ie will read it.

hope this helped and was relevant this time
 
Back
Top Bottom