I’ve posted a thread about this site and got some help from some of you, which I’m thankful for. I’ve adapted the site as to the advices.
The site looks ok (I’m still in the draft zone) but the basic-layout should be fine.
The site is on: www.advocaat-kvd.be
Problem is now in Internet Explorer. the header should normally be in grey, and filled up with the headerfill.jpg.
I didn’t have the problem before I adapted some things, but I can’t seem to find where the problem lays. I find it odd that its a repeating jpg he doesn’t show.
Can you guys give me some explanation why this happens and how to fix it?
It’s not a css issue (the background is applied inline - bad developer…bad! bad! ;)) - you are attempting to apply the background to the row instead of the cell. Apply the background to the cell and it works
Maxx-iT, your original purplish table layout was pretty good. It needed some work, but that was easily done by deleting deprecated or wrongly placed attiributes and replacing them with css. I’m not exacty sure what you gained by creating this hybrid layout.
Reinforcing what DaveMaxwell said: Internet Explorer is dutifully pointing to “bad” table code. <tr> is not the place for “background” attributes. The background can be applied to the <table> tag or the <td> tag, but should be applied via css. Very little can be applied to a <tr> tag. Even height should be applied to <table> or <td> tags, preferably via css.
Lines 55 and 56 contains several unmatched tableware tags.
It would be a good idea to validate your page. The validator will point out these problems and thereby lead you to the fixes.
So I tried to work on the tips you gave me above. I applied the background to the td-tag instead of the tr. (That’s an advice I’ll never forget ). It looks pretty ok now. Normally I never place my backgrounds inline, but I had to apply classes to all the td’s I wanted to change, and thought it would be ‘easier’/‘faster’ to apply them inline. Does applying inline have any particular repercussions?
In response to you ronpat: Originally, the entire site was built with tables. I posted it here in the css-section and got the response that tables were so much outdated and should be replaced with divs. I tried to do so, and replaced the main structure with divs. I opted to keep 3 major tables inside the divs for positioning aspects (header, content, footer). If I were to replace them aswell by divs, I had to rewrite my entire css, and couldn’t get out of the chaos it would create.
The validator did it’s job and I was able to fix most. I still get some warnings about attributes that are non-existing in XHTML 1.0 like “border”, “role”, “height”, “background”, but I guess we don’t have to worry bout that.
I do have another problem I can’t seem to fix and need your help with. I have a logo in the header “Advocaat Kathleen Van doorsselaere”. This logo is a jpeg and is made with Photoshop which I have the .psd from. It’s my intention to place the text on the headerfill, so without the white background. I was able to do it a long time ago, but forgot it through the course of time.
Can I fix this with CSS? I know I need the vectorial text to be applied above the background, but I can’t seem to recall how.
). It looks pretty ok now. Normally I never place my backgrounds inline, but I had to apply classes to all the td’s I wanted to change, and thought it would be ‘easier’/‘faster’ to apply them inline. Does applying inline have any particular repercussions?