problem including css file ..help [Archive]

View Full Version : problem including css file ..help

guyenhtml000

06-14-2007, 05:24 AM

Hello I specified the styles in the styles.css and included following reference in my web:
<LINK REL=STYLESHEET HREF="../styles/styles.css" TYPE="text/css">

But wehn I included it, the background color or background image will disappear from the page. If I remove this CSS reference, then background color and image will come back. Can someone explain what is going on? Thanks!

_Aerospace_Eng_

06-14-2007, 05:34 AM

Can you post a link to your page? I can tell you this, your background images are relative to the location of the CSS file not the web page.

guyenhtml000

06-14-2007, 07:42 AM

Well, my styless is in different folder (go up and go to another folder). But that doesn't seem to be the source of problem at all. I have moved my style.css file into current file and pointed the reference to the one in current folder, still same result.
<LINK REL=STYLESHEET HREF="styles.css" TYPE="text/css">

If background image is relative to the location of css, then what is your opinion about the background color is not being displayed, not the image? Thanks!

I don't have the web online, but I included teh code here just in case:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
<HEAD>
<TITLE ALIGN=CENTER> GRAND SKY Inc. - Premier Mongolian Travel Agency </TITLE>
<LINK REL=STYLESHEET HREF="styles.css" TYPE="text/css">
</HEAD>

<BODY BGCOLOR=#1e3666>



<SPAN STYLE="Position: absolute; top: 10px; left:10px;">

<IMG SRC="../pictures/GstLogo.jpg" ALIGN="middle"></SPAN>



<SPAN STYLE="Position: absolute; top: 120px; left:10px;">

<IMG SRC="../pictures/SubTitleBar.jpg" ALIGN="middle"></SPAN>



<SPAN STYLE="Position: absolute; top: 80px; left:210px;">

<IMG SRC="../pictures/GradientBarLeft.jpg" ALIGN="middle"></SPAN>



<SPAN STYLE="Position: absolute; top: 30px; left:230px;">

<A HREF="Main.htm">

<IMG SRC="../pictures/BtnHome.jpg"BORDER="0"></A></SPAN>

<SPAN STYLE="Position: absolute; top: 30px; left:293px;">

<A HREF="OurTours.htm">

<IMG SRC="../pictures/BtnOurToursHiLite.jpg"BORDER="0"></A></SPAN>

<SPAN STYLE="Position: absolute; top: 30px; left:380px;">

<A HREF="Mongolia.htm">

<IMG SRC="../pictures/BtnMongoliaAndDestinations.jpg"BORDER="0"></A></SPAN>

<SPAN STYLE="Position: absolute; top: 30px; left:567px;">

<A HREF="TravelEssentials.htm">

<IMG SRC="../pictures/BtnTravelEssentials.jpg"BORDER="0"></A></SPAN>

<SPAN STYLE="Position: absolute; top: 30px; left:700px;">

<A HREF="AboutUs.htm">

<IMG SRC="../pictures/BtnAboutUs.jpg"BORDER="0"></A></SPAN>

<SPAN STYLE="Position: absolute; top: 30px; left:787px;">

<A HREF="ContactUs.htm">

<IMG SRC="../pictures/BtnContactUs.jpg"BORDER="0"></A></SPAN>



<SPAN STYLE="Position: absolute; top: 130px; left:52px;">

<A HREF="UnderConst.htm">

<IMG SRC="../pictures/SubBtnOurTours_Discover.jpg"BORDER="0"></A></SPAN>

<SPAN STYLE="Position: absolute; top: 160px; left:52px;">

<A HREF="UnderConst.htm">

<IMG SRC="../pictures/SubBtnOurTours_Explore.jpg"BORDER="0"></A></SPAN>

<SPAN STYLE="Position: absolute; top: 190px; left:52px;">

<A HREF="UnderConst.htm">

<IMG SRC="../pictures/SubBtnOurTours_Engage.jpg"BORDER="0"></A></SPAN>

<SPAN STYLE="Position: absolute; top: 220px; left:52px;">

<A HREF="UnderConst.htm">

<IMG SRC="../pictures/SubBtnOurTours_Impress.jpg"BORDER="0"></A></SPAN>

<SPAN STYLE="Position: absolute; top: 250px; left:52px;">

<A HREF="UnderConst.htm">

<IMG SRC="../pictures/SubBtnOurTours_Inspire.jpg"BORDER="0"></A></SPAN>





<SPAN STYLE="Position: absolute; top: 140px; left: 230px; width: 500px;

background-color: #4e86a6; padding: 20px;
z-index: 4;">

<H5>Our tours: </H5>

<UL TYPE="square">
<LI>Organized package tours for individual and group travelers
<LI>Tailor made tours
<LI>Incentive tours
<LI>Business travel arrangements
</UL>

<H5>Our services: </H5>

<UL TYPE="square">
<LI>International and domestic flight and train ticket reservation
<LI>Hotel and ger camps accommodation
<LI>Mongolian and international cuisine meals
<LI>Guide services
<LI>Transportation by vehicles chauffeured by experienced drivers
<LI>Sightseeing and events
</UL>

</SPAN>



<SPAN STYLE="Position: absolute; top: 600px; left: 230px; width: 500px;

background-color: #4e86a6; padding: 20px;
padding: 20px;

z-index: 4;">
<H2>1.DISCOVER</H2>
<H3>Tour 1:</H3>
<H3>Tour 2:</H3>
</SPAN>
</BODY>

</HTML>

_Aerospace_Eng_

06-14-2007, 07:58 AM

The current version of HTML is 4.01 and you seem to be using 3.2. From what I can tell looking at your code that you are using an excessive amount of absolute positioning. Most layouts require little or NO absolute positioning. Again please post a link to your page so we can see what your layout is intended to look like and hopefully advise you on how to code it better.

ahallicks

06-14-2007, 09:11 AM

<LINK REL=STYLESHEET HREF="styles.css" TYPE="text/css">

Should read:

<link href="styles.css" type="text/css" rel="stylesheet">

But do what Aero said, it helps if we can see your code AND the page as a description of the problem is usually not sufficient enough for us to help you with your problems.

guyenhtml000

06-15-2007, 04:40 AM

Ok here is hte link to the page.
I know I am using too much absolute positioning but that is the level of skill I am in :). Unless it is causing the problem I am mentioning...
I have commented out the external style sheet include line so that the page can have its background color. Thanks!
http://www.grandskytours.com/htmpages/OurTours.htm

_Aerospace_Eng_

06-15-2007, 04:46 AM

In the stylesheet you set the background color to white on this line
BODY {background: white; color: black}
Which is why you probably think its going away.

guyenhtml000

06-15-2007, 07:27 AM

In the stylesheet you set the background color to white on this line
BODY {background: white; color: black}
Which is why you probably think its going away.
Thanks maan!!! Look It looks much better now!