Click to See Complete Forum and Search --> : css and html, new homepage, bewildered...


Saithr
07-18-2005, 05:33 AM
Making a new homepage for an expedition I am doing. The graphic design is done but I want it to look pretty much like this homepage:
www.turtagro.no (http://www.turtagro.no)

Is css layout the best way to go? I am not a beginner in either html or css but I have never done layouts with css, only formatting.
Anyone know of a good tutorial that covers a page similar to the one above? And is css the best way to attack the project, or is there any other ways that is faster and easier to update, the two most important things..

Thanks!! If I am not being specific enough please tell me!

LJK
07-18-2005, 05:04 PM
Hi -
Here's one version of what the .html could be like if trying to separate styles from content - which is a good switch from the original site! -

<div class="container">
<div class="header"> [w/ bkgnd. img for right side image]
<img> [for the logo on the left]
<p or span> [for left part and links to the right]
</div>
<div class="main"> [floats right w/ set width]
<p>...
</div>
<div class="left"> [floats right w/ set width]
</div>
<div class="foot"> [which has clear:both;]
</div>
</div>

Other areas in which you might want to deviate from the original are:
- declare a !DOCTYPE
- try not to use images as links

And if you're new to CSS, I'd suggest adding internal styles up in the <head> during authoring - then switch it over to an external, linked page when starting to do the rest of the site pages. [Centralization = fewer headaches during edits: you got that right, too!]

Good luck & have fun,
El

Saithr
07-19-2005, 06:36 AM
Thanks! I am going to get started on the building soon, give you a link when it is done ;)

But one question, why not use images as links? Is there any way to get the graphical design I want without using images as links?

the tree
07-19-2005, 06:54 AM
If the images are legible then there's no major issue although you should make sure that you are using alternate text for non-graphical browsers and search engines.

Saithr
07-26-2005, 09:43 AM
Hey! been doing some work on the page now and it is looking better, but having a problem with the menu and the content not being horizontally alligned, the menu is above the content, as in higher up on the page. Any clue how I can fix this?

here is the code so far:


#menu
{float: left;
width: 100px;
background-color: green;}

#contents
{
margin-left: 116px;
background-color: #6894B7;}


Any clue why they are not horizontally alligned?
Thanks!

bogbrushian
07-26-2005, 06:37 PM
try clear: both; in the bottom bit