Programming Forums > Web Development and Design > HTML / XHTML / CSS

Obtruse_Man4 · Nov 11th, 2005, 12:53 PM

Not that I'm blaming it on them, but ever since iignotus and DaWei helped me I've been experiementing with div tags and style sheets, and through that my site has been thoroughly destroyed by myself. Let me say right now though that I really hate IE. No matter what I do, it never displays my code the way I want it to. Anyway... I've been working on this for a day or two and couldn't figure it out, so here I am.. again. For reference, my site is: http://www.farsideofthegalaxy.com.

I decided to center my entire site and make the width 720px. I think that's the recommended width for universal resolution friendliness, no? I've run into some problems with the div tags and the way I had things setup before. Is there anyway to create a "container" that centers itself and is 720px wide? I tried tables, and that didn't work, or maybe I just can't code it well, which is more likely. My css is a mess right now. If you take a look at the downloads or christmas wishlist page you will see what I'm talking about. Also my footer won't center in firefox, but surprisingly it displays correctly in IE. Not sure why it won't center?

The extensions I have aren't allowed to be uploaded, so I've zipped them. Just ask if you want to see the code for any others. Any help on this and anything else concerning my site would be appreciated. Design, coding style and methods, I need help with it all. Thanks!

iignotus · Nov 11th, 2005, 1:49 PM

How about putting everything in a div? Then just do the 'page-global' stuff with that one containing div. (Note, I haven't yet looked at your code.)

bja888 · Nov 11th, 2005, 3:13 PM

Quote:

Originally Posted by Obtruse_Man4

Is there anyway to create a "container" that centers itself and is 720px wide? I think that's the recommended width for universal resolution friendliness, no?

I usually go with 750 but on the webmaster forums they say about 780px. Its all up to you, but at least you have the right idea

Quote:

Originally Posted by Obtruse_Man4

I tried tables, and that didn't work, or maybe I just can't code it well, which is more likely.

Tables are tricky, spent all this time getting good at em then the W3 kicks me in the balls.

Quote:

Originally Posted by Obtruse_Man4

Also my footer won't center in firefox, but surprisingly it displays correctly in IE. Not sure why it won't center?

There is that text-align proublem I pointed out a while back.

Site looks much better now, it looks like a standerd css template. Nice, clean and organised. Point out every proublem you are having and I'll help you find a solution to each.

DaWei · Nov 11th, 2005, 3:24 PM

Just a quick look reveals a couple of things. Your syntax must be correct. This is not correct:

(Toggle Plain Text)

<div style="width: 360px; float:"left" border: 0px solid #ffffff; padding: 10px;">

Rather,

(Toggle Plain Text)

<div style="width: 360px; float: left; border: 0px solid #ffffff; padding: 10px;">

Sure, it's confusing to go from old-style tag attributes, but you just have to get there. Syntax highlighting with a good editor would help considerably.

Also remember that a "center" attribute is generally specifying that the CONTENTS of a container be centered, not the container, itself.

Think like a browser. There's no real relationship between the size of the browser window, and its resolution, and your content. Shoehorning tends to be the order of the day. The browser renders from top to bottom and left to right, unless you override things. It wraps when it hits the right hand side, unless you override that. A page has no "bottom" other than the end of content, unless you DEFINE a bottom by one means or another, and that can get messy.

My recommendation would be for you to always include a border with all your major containers. Color them differently. Make them wide enough to see. Observe how the containers lay out. Borders can always be set to 0, or removed, when you're happy.

Containers are a hierarchical thing. IE tends to miss out, sometimes, on what the enclosing container really is. Positioning can therefore be a pain in the butt. Sometimes one just has to experiment, and dink around. Believe me, it's much better than a few years ago. Once you get a reasonable handle on it, you won't be sorry. I'm quite sure that neither Iignotus, nor myself, set out to destroy your site. Perhaps you could hire BJ to fix it

.

bja888 · Nov 11th, 2005, 3:48 PM

I agree with everything DaWei just said. (Exept thie hire me thing)

Basicly he is explining in depth everything I just touched apon in the prevoius thread. Like I said before, if that is the result you want xhtml proublay isnt the best tool to do it in. html isnt phased out yet and it deals with height rather well as flawed as the consept might be.

Agent 47 · Nov 11th, 2005, 4:32 PM

I don't know what it is you have against XHTML, I think you might
have read something about it somewhere and horribly misunderstood
what it said...

Nov 11th, 2005, 1:49 PM	#2
iignotus Professional Programmer Join Date: Apr 2005 Location: Nowhere Special Posts: 466 Rep Power: 4	How about putting everything in a div? Then just do the 'page-global' stuff with that one containing div. (Note, I haven't yet looked at your code.) __________________ (Toggle Plain Text) % rc4 hexkey < input > output #define S ,t=s[i],s[i]=s[j],s[j]=t /* rc4 hexkey <file / unsigned char k[256],s[256],i,j,t;main(c,v,e)charv;{++v;while(++i)s[ i]=i;for(c=0;(v)++;k[c++]=e)sscanf((v)++-1,"%2x",&e);while(j+=s[i] +k[i%c]S,++i);for(j=0;c=~getchar();putchar(~c^s[t+=s[i]]))j+=s[++i]S;}

Nov 11th, 2005, 3:24 PM	#4
DaWei Resident Grouch Join Date: Jun 2005 Posts: 6,453 Rep Power: 10	Just a quick look reveals a couple of things. Your syntax must be correct. This is not correct: (Toggle Plain Text) <div style="width: 360px; float:"left" border: 0px solid #ffffff; padding: 10px;"> <div style="width: 360px; float:"left" border: 0px solid #ffffff; padding: 10px;"> Rather, (Toggle Plain Text) <div style="width: 360px; float: left; border: 0px solid #ffffff; padding: 10px;"> <div style="width: 360px; float: left; border: 0px solid #ffffff; padding: 10px;"> Sure, it's confusing to go from old-style tag attributes, but you just have to get there. Syntax highlighting with a good editor would help considerably. Also remember that a "center" attribute is generally specifying that the CONTENTS of a container be centered, not the container, itself. Think like a browser. There's no real relationship between the size of the browser window, and its resolution, and your content. Shoehorning tends to be the order of the day. The browser renders from top to bottom and left to right, unless you override things. It wraps when it hits the right hand side, unless you override that. A page has no "bottom" other than the end of content, unless you DEFINE a bottom by one means or another, and that can get messy. My recommendation would be for you to always include a border with all your major containers. Color them differently. Make them wide enough to see. Observe how the containers lay out. Borders can always be set to 0, or removed, when you're happy. Containers are a hierarchical thing. IE tends to miss out, sometimes, on what the enclosing container really is. Positioning can therefore be a pain in the butt. Sometimes one just has to experiment, and dink around. Believe me, it's much better than a few years ago. Once you get a reasonable handle on it, you won't be sorry. I'm quite sure that neither Iignotus, nor myself, set out to destroy your site. Perhaps you could hire BJ to fix it . __________________ Abstraction doesn't make it impossible to write bad code; it makes it possible to write superior code. Contributor's Corner: Grumpy on C++ Exceptions DaWei on Pointers

Nov 11th, 2005, 4:32 PM	#6
Agent 47 Hobbyist Programmer Join Date: Nov 2005 Posts: 122 Rep Power: 3	I don't know what it is you have against XHTML, I think you might have read something about it somewhere and horribly misunderstood what it said... __________________ "I'm going to become rich and famous when I invent a device that allows you to stab people in the face over the internet"

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Nov 11th, 2005, 3:48 PM	#5
bja888 Hobbyist Programmer Join Date: Oct 2005 Location: Central, FL Posts: 213 Rep Power: 0	I agree with everything DaWei just said. (Exept thie hire me thing) Basicly he is explining in depth everything I just touched apon in the prevoius thread. Like I said before, if that is the result you want xhtml proublay isnt the best tool to do it in. html isnt phased out yet and it deals with height rather well as flawed as the consept might be.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

Programming Forums > Web Development and Design > HTML / XHTML / CSS

Need css help