6 replies [Last post]
Enigmatix
Offline
newbie
Last seen: 16 years 40 weeks ago
Timezone: GMT-6
Joined: 2004-04-23
Posts: 4
Points: 0

Hi,

I've been having problems with the borders on my site now for nearly a week and haven't been able to fix the problem. I tried posting on WebMasterWorld, but no one seems to want to help. Luckily, I came across this site. Thank God!

My problem is that my borders are splitting. It's happening in all of the browsers I've checked, although it looks the worst in IE. I've checked my site using Opera 7.23, IE 6.0, Netscape 7.0 and FireFox 0.8.

I have tried to build the site entirely using CSS, HTML and JavaScript (no tables or frames). If anyone could check my site and tell me what's wrong, I would be most appreciative. Thanks,

Enigmatix

http://www.sisullaw.com/notables2.shtml

co2
co2's picture
Offline
Leader
UK
Last seen: 12 years 41 weeks ago
UK
Joined: 2003-09-17
Posts: 721
Points: 0

Having problems with the borders on my web site

Everything seems fine in Safari. I've checked in Firefox 0.8 (OS X), and the only problem I can see is that the left content box's content, is overspilling out of it's container. Is this what you are referring to?

[EDIT]: Oops, just noticed the same problem on the main content box in Safari, ever so slight though.

The next sentence is true. The previous sentence is false. Discuss...

Enigmatix
Offline
newbie
Last seen: 16 years 40 weeks ago
Timezone: GMT-6
Joined: 2004-04-23
Posts: 4
Points: 0

Having problems with the borders on my web site

If my content is overspilling, then this is a new problem. I don't have a mac though, so I can't doublecheck to see what it is you're seeing. What I see is that my borders are not exactly normal at the bottom. They look great on the top, left and right, but the bottoms are splitting apart to meet up with the footer. When I say splitting, I mean that the darker inner green part is becoming wider to accomodate the lack of content.

I'm using JavaScript to control the height of the "content boxes" so that no matter how much content they contain, they all meet up evenly with the footer. Maybe this is the problem. However, I am completely guessing. Thanks for looking.

MaxJ
MaxJ's picture
Offline
Regular
Last seen: 8 weeks 3 days ago
Joined: 2003-08-28
Posts: 36
Points: 0

Nested Div

I think this may be due to the nested DIV. The outer DIV doesn't have any content other than the inner DIV. Maybe try and reduce to just one DIV.

Max

Enigmatix
Offline
newbie
Last seen: 16 years 40 weeks ago
Timezone: GMT-6
Joined: 2004-04-23
Posts: 4
Points: 0

Having problems with the borders on my web site

Thanks for the suggestion Max. However, I tried it and it doesn't work. Unfortunately the inner tag is necessary to create the border the way it is. The border is made up of a 1 pixel #00CC00 outer line
2 pixel #006600 inner line
and a 1 pixel #00CC00 outer line.

When the extra div is extracted, only the 1 pixel #00CC00 outer line becomes the border and the 2 pixel #006600 inner line just fills in as the background. Thus in order to acheive the effect I want, the inner div must be in tact. I really appreciate the help though. Thanks.

MaxJ
MaxJ's picture
Offline
Regular
Last seen: 8 weeks 3 days ago
Joined: 2003-08-28
Posts: 36
Points: 0

Specify what you want

I've had another look at your code, although it is difficult to know what to suggest because I am not entirely sure what you are trying to achieve. To start with, you have fixed everything in pixels, so the look is very different in IE6 compared to NS7.1 (on Win32), particularly when you resize the text or the browser window.

As I see it, you are trying to have 3 columns.

Each column has an outer green border and a contrasting green background.

The inner content of each column also has a green border but a black background.

The columns with shorter content have a green background fill at the bottom so that all three columns are the same height. (And I assume, if you use a browser other than IE the columns should increase in height and not break when the font size is increased.)

I'm not familiar with the Javascript routines you are using so am not sure what effect these might have, but I would have thought there was an easier solution. Also, It would be a good idea to run your code through a code checker and make it valid XHTML. This may be causing a problem.

Max

Enigmatix
Offline
newbie
Last seen: 16 years 40 weeks ago
Timezone: GMT-6
Joined: 2004-04-23
Posts: 4
Points: 0

Having problems with the borders on my web site

Dear Max,

I appreciate your insight. I didn't realize my menu was getting screwed up when you resized the text in Netscape or FireFox. In IE, you can't resize the text for points (which all of my text uses) or for pixels. Thus as the text size gets smaller or bigger for the menu in Netscape, because my menu uses pixels, the words tend to fall off the grey background. I don't know a fix for this either. That is short of some code I'm not aware of that prevents Netscape and FireFox uses from changing their text size.

As well, I have validated my web site and it is XHTML 1.0 Transitional compliant according to the W3C Validation. So is my CSS file.

As for thinking there's an easier way, I wish there were, but as of right now I'm stumped.

Lastly, you said that my site looked very different in IE 6 and Netscape 7. What are you referring to? Does this major difference only occur when you resize the text? Because otherwise to me on my computer (using Windows) it looks basically the same. Except that the web site is a little further down on the screen and a little wider in Netscape, due to the setup of the program. Thanks for your help.

Do you or does anyone else have any other ideas as to what might be wrong?

Enigmatic