Programming Forums - HTML/CSS project

Programming Forums (http://www.programmingforums.org/forumindex.php)

- HTML / XHTML / CSS (http://www.programmingforums.org/forum27.html)

- - HTML/CSS project (http://www.programmingforums.org/showthread.php?t=15167)

HTML/CSS project

Hello,

I have a project for school due this week. I need to have a splash page and 2 other pages. One of those pages must not contain a link to CSS.

I have the main layout done with some text and effects. The problem is that I am positioning everything with CSS (including paragraphs). Therefore if I do not include a link to a css page, the layout will not look right (he wants it to look right even without CSS). The only way I can think of fixing this problem is just to include the <p> </p> in side the div but I want more control over position.

I also have another problem, When I preview my page using dreamweaver CS3 in FIrefox everything looks fine however when viewing in IE its looks messed and some effects do not work (bliking for example) and text font is different. How can I fix this.

Note: Content is dummy content.

Here is the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />



<title>The City</title>



<style type="text/css">



body{

        background-image: url(images/DSC_2609.JPG);        

}



#banner{

        position:absolute;

        left:250px;

        top:0px;

        

}



#content{

        position:absolute; 

        top:178px;

        left:250px;

}



#navbar{

        position:absolute;

        top:149px;

        left:250px;

        

}



#footer{

        position:absolute;

        bottom:30px;

        left:250px;

}



h1{

        position:absolute;

        left:78px;

        font-family:Arnoldboecklin, fantasy;

        text-decoration:blink;

        color:#CC0000;

}



h2{

        position:absolute;

        top:200px;

        left:335px;        

        font-family:Arnoldboecklin, fantasy;

        text-decoration:underline;

        text-decoration:line-through;

        color:#CC0000;

}



p{

        position:absolute;

        top:230px;

        left:335px;

        font-family: Arnoldboecklin, fantasy;

        color:#0000CC;

        

}



</style>



</head>



<body>



<div id="banner"><img src="images/Banner.gif" /></div>

<h1> Welcome To </h1>



<div id="content"><img src="images/content1.gif" /></div>

<h2> About </h2>

<p>The city is a critically acclaimed PC game, developed by marionette design and published by EA Games.</p>



<div id="navbar"><img src="images/navbar.gif" /></div> 



<!-- <div id="leftwrapper"><img src="images/left_wrapper.gif" /></div>

<div id="homeoriginal"><img src="images/home_orignal.gif" /></div> -->



<div id="footer"><img src="images/Footer.gif" /></div>



</body>

</html>

Re: HTML/CSS project

you can make a class for the paragraph tag, that way only paragraphs you assign the class to will be positioned differently.

here is the w3 schools part on css class syntax
http://www.w3schools.com/css/css_syntax.asp

Re: HTML/CSS project

Are you not allowed to use CSS or are you not supposed to use an external file?

Re: HTML/CSS project

I now have a class for my paragraph. But can I somehow change the position of the body (which is an image from photoshop sliced) withouth using css? Can I somehow include it inside the div? That would help alot since the second page must not have a link to the CSS page.

Re: HTML/CSS project

let me begin by saying that everything that can be done using an external style sheet can be done with internal styles.

without using css you can use the align attribute, i don't know how well that will work though.

Re: HTML/CSS project

Ok for the first page everything wokrs fine with css and for the second page I managed to align everything without CSS. However, If i wanted to write a paragraph on to the body how can I do this without CSS. It worked perfectly with CSS by making a a class and then positioning it over the body image. Is there a way to do this without CSS? like maybe change the body image intobackground but without reapeat? lol if you didn't notice I am new to this, but I'm learning fast!

Re: HTML/CSS project

w3 schools is probably one of the most valuable references available,
http://www.w3schools.com/css/default.asp

if you need to position elements on the page without using css, you could use tables - positioning with css is highly recommended.

As for your background images, try setting the background="" attribute on the body tag, if the image is smaller than the page it will repeat itself.

Re: HTML/CSS project

IE is not following any rules.. They are going their own way. And will be thrown out soon..

Re: HTML/CSS project

The new IE will have proper standards compliance, there is news that internal builds can already render the acid2 test properly.

Aside from that i just use tripoli mass css reset and everything is fine...

Re: HTML/CSS project

Just use internal styles. Also, most people would not have those fonts.