Hi All,

 

I have just started creating a Website for a friend, but im really new to this.

 

I've created my site, sliced, tweaked and created a template from it - that all went ok (I think)

 

But ive reached a stumbling block...I defined my content area as an editable region which is fine but If i enter more than 1 line of text or enter an image the whole site gets out of line when viewing in Firefox. Looks fine in IE but that due to 'quirks mode' which i have read about (briefly)

 

I've set the boarders of all my images to 0 but this didn't seem to help.

 

Not sure if this is common issue or not, or if someone would need to see the code to possibly help?

 

Regards,

 

Nathan

Would need to see the code really m8.

i know your problem

 

if you have done this in photoshop then slising and saving as html/images will put the whole thing in to a table.

 

i would advise having a simple background and then making images sepreate.

basickly bulid it in code or dreamweaver net objects (what ever you use) take it from there.

 

if your still stuck pm me and i would be more than happy to go threw the site for you. even teach you if need be. there is some stuff on creating a webstie on my youtube chanal >>> manictuts <<< i have not finished it yet but you might find some stuff there.

 

hope this helps

Thanks for the input so far..ive zipped my site and attached it. Would be great if someome would take a look for me?

 

I had a look at manictuts, seems like you are building a good channel there.

BSLProject.zip

is it online? Alot easier for people to look at if it is, they don't have to rebuild your site on their own system.

is it online? Alot easier for people to look at if it is, they don't have to rebuild your site on their own system.

 

Just uploaded it now to a temp location.

 

Website/

 

Its very basic but you will see what i mean about the alignment if you open in both IE & Firefox.

well Chrome and IE8 look the same, Firefox has some weird breaks on the left and right side borders. Have you validated your code. You haven't got a DOCTYP to start with and that could be throwing up a heap of oddities.

and it it's not online then publish it in a testing folder or a free web host or your ISP's free web space.

ok looking threw your code this was done in photooshop

so photoshop puts it all in a table and if you put info in the table it moves.

 

the way to fix this is not use photoshop to buld it. you buld it your self.

 

now i know i was not asked to but i have had a fidle and got the whole thing working.

i have put the banner in a table because that is the ownly way to make that how it is.

the rest is all divs and css. i had to fidle with some of the images to so that they had the black lines round it but thats all iv done.

the main content div has the content image as a background so it does not move and it extends downwards (i think ) if not add the repeat balue to it so it does.

 

dont feal bad it only took me 5 min to put togeather

 

the file attachemt is there feal free to use it.

 

i hope this helps

 

BSL new.zip

Yup, tables are baaaad. In a layout sense. It's much better to build your layout in CSS. Not all that difficult once you understand the basics. Hellofalot of tutorials on the web.

 

Goodluck,

~evu.

And here i was thinking how easy it was to export from photoshop! To good to be true!

 

I really appreciate what you have done for me SgtMoody, great work. The only slight problem is when viewing the site in any browser there is now a grey band above and below the main content box. How would i remove this?

 

Regards,

 

Nathan

 

**Edit**

 

The gey band expands when more text is added

i will have a look at it latter on

i will have a look at it latter on

 

Ok.

 

I deleted the BG image and just replaced it with a backgorund colour so that it gets bigger the more text you type. This resolved the grey band getting any bigger but it is still showing

 

**Edit**

 

Updated the online version aswell to show problem.

Ok.

 

I deleted the BG image and just replaced it with a backgorund colour so that it gets bigger the more text you type. This resolved the grey band getting any bigger but it is still showing

 

**Edit**

 

Updated the online version aswell to show problem.

 

Can you add this to your css

h1 { margin:0 auto;}

Can you add this to your css

h1 { margin:0 auto;}

 

 

Sorry going to have to back track abit. I replaced the background image with just a background colour but didnt notice that sgtmoody had tweaked it so the black lines were part of the image this time. Ive changed back the image as the background.

 

If I add the h1 tag nothing seem to happen.

You have removed your h1 now, thats why's pats solution no longer works

 

Add to css

 

*{margin:0;padding:0;}

 

and do a search for css reset

You have removed your h1 now, thats why's pats solution no longer works

 

Add to css

 

*{margin:0;padding:0;}

 

and do a search for css reset

Damn should of noticed there was no reset

Brilliant, just what i wanted! Thanks so much!

 

Im starting to get my head around this CSS lark now

 

Cheers guys!

Brilliant, just what i wanted! Thanks so much!

 

Im starting to get my head around this CSS lark now

 

Cheers guys!

 

you can remove the h1 setting in your css

you can remove the h1 setting in your css

 

Ok thanks.

 

One final thing, how can i fix the size of the content area? It gets bigger as text is added and becomes smaller when it is removed.

Ok thanks.

 

One final thing, how can i fix the size of the content area? It gets bigger as text is added and becomes smaller when it is removed.

 

if you add

min-height:754px;

to your #maincontent that will hold the area at that height, however if your text exceeds that you will have problems as your background image is only 754px in height so you will have to also add

background-repeat: repeat-y;

to #maincontent.