View Full Version : an obvious solution?

05-29-2007, 02:15 PM
Most likely. But seeing as though im an old timing htmler, css is new..and annoying :)


All i want is my stupid layout to align.. help?
I designed this offline just using mainly notepad, but when I uploaded it, it suddenly decided to do its own thing and I cant fix it!
Any other problems you may come across feel free to discuss - but go easy for my undeveloped css brain! lol.


05-29-2007, 04:10 PM
Hello Shannon,

OK, the first thing you’re missing is a doctype. This is not just for the looks of your code it makes IE render your pages like modern browsers, not like the even older ones.
Number two: This isn’t gonna work: <img src='D:\Documents and Settings\shannon\My Documents\My Webs\Australian Black Worms\Banners\logo.gif' width=283 height=99> The website, once it’s online, can’t get images from your personal hard drive. Also be aware that there are Adblockers that are blocking images with “ad” or “banner” in the file name. I had once had this and it took a while until I found out why my Firefox isn’t displaying an image.

Your CSS looks alright from a short glimpse. Put a border around elements that make problems or that you are working on to see where they are and how they behave. For example, you forgot to clear your floats (e.g. for you footer).

Don’t have too much time right now. I might look deeper into it later.

05-29-2007, 04:14 PM
Hello Mina :),

I used Notepad too, but better html editor is for example http://www.pspad.com, it supports syntax highlighting thats a good thing.

I edited your code little bit so you will see if you like it or not. I did a few modifications, I replaced for example <img src="images/space.jpg"> with margin-top of homebut.jpg, and I removed font and center tags.

In your header div there is image with "D:\Documents and Settings\shannon\My Documents\My Webs\Australian Black Worms\Banners\logo.gif" source, I changed this source to "http://www.blackworms.com.au/images/logo.gif".

Here is your main.css

* { padding: 0; margin: 0; }

body {
background-image: url('http://www.blackworms.com.au/images/back034.jpg');
background-repeat: repeat-x;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
text-align: center;
#wrapper {
margin: 0 auto;
margin-top: 20px;
width: 922px;
background-color: #4679BC;
#header {
color: #333;
border: 1px solid #CCCCCC;
height: 100px;
background-color: #4679BC;
border: 1px solid #4672B4;
#leftcolumn {
padding: 9px;
color: white;
font-family: garamond;
border-right: 1px solid #4672B4;
background-color: #4679BC;
width: 680px;
float: left;

#rightcolumn {
float: right;
color: #333;
background-color: #4679BC;
width: 218px;
height: auto;

#homebut {
margin-top: 30px;

#footer {
clear: both;
height: 55px;
border: 1px solid #4672B4;
background-color: #4679BC;

#copy {
padding: 9px;
padding-top: 18px;
color: white;

And constuction.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<link rel="stylesheet" type="text/css" href="main.css" />

<!-- Begin Wrapper -->
<div id="wrapper">

<!-- Begin Header -->
<div id="header">
<img src="http://www.blackworms.com.au/images/logo.gif" width=283 height=99>
<!-- End Header -->

<!-- Begin Left Column -->
<div id="leftcolumn">
<img src="http://www.blackworms.com.au/images/welcome%20banner.jpg"><br>
Le cheval (caballus d'Equus, parfois vu comme sous-espčce caballus de cheval, d'Equus de ferus sauvage) est un grand mammifčre impair-botté avec la pointe du pied d'ungulate, une de dix espčces modernes du genre Equus. Les chevaux ont longtemps été parmi les animaux domestiqués le plus économiquement importants ; bien que leur importance ait diminué avec la mécanisation, ils sont encore trouvés mondiaux, ajustage de précision dans l'humain vit dans diverses maničres. Le cheval est en avant dans la religion, la mythologie, et l'art ; il a joué un rôle important dans le transport, l'agriculture, et la guerre ; il a en plus servi de source de nourriture, de carburant, et d'habillement. <br><br>
Presque toutes les races des chevaux peuvent, au moins dans la théorie, porter des humains sur leurs dos ou ętre armé pour tirer des objets tels que des chariots ou des charrues. Cependant, des races de cheval ont été développées pour permettre ŕ des chevaux d'ętre spécialisées pour certain chargent ; les chevaux de sang pour emballer ou monter, les chevaux plus lourds pour cultiver et autre charge l'exigence tirant la puissance. Dans quelques sociétés, les chevaux sont une source de nourriture, viande et lait ; dans d'autres elle est taboue pour les consommer. Dans les pays industrialisés des chevaux sont principalement gardés pour des loisirs et des poursuites sportives, alors qu'ils sont encore employés en tant qu'animaux travaillants dans beaucoup d'autres régions du monde.
<!-- End Left Column -->

<!-- Begin Right Column -->
<div id="rightcolumn">
<img src="http://www.blackworms.com.au/images/homebut.jpg" id="homebut"><br>
<img src="http://www.blackworms.com.au/images/about.jpg"><br>
<img src="http://www.blackworms.com.au/images/products.jpg"><br>
<img src="http://www.blackworms.com.au/images/contact.jpg"><br>
<!-- End Right Column -->
<!-- Begin Footer -->

<div id="footer" align="left">
<div id="copy">&copy; spirited pony 2007</div>
<!-- End Footer -->

<!-- End Wrapper -->


05-29-2007, 07:10 PM
All i want is my stupid layout to align.. help?

All I want is for you to read the Posting Guidelines (http://codingforums.com/postguide.htm) before posing a new thread. Specifically, don't use vague titles like "an obvious solution."