12 replies [Last post]
arttie_br
arttie_br's picture
Offline
Regular
Maring
Last seen: 13 years 37 weeks ago
Maring
Joined: 2006-10-16
Posts: 15
Points: 0

Hi everybody.
Below I will describe my problem in details.
I was asked to work in templates for a web app. Although I am used to create my own layouts, and thus prefer working with the liquid ones, this time I was given a scheme to work over, and it is a one with slices. Ok, this part I believe I have solved, but I am having problems with following/wrapping content, and with absolute positioning.

To tell the truth, it is a combo of 3 layouts. A template of an index (main) page, a template for inner pages and a template for reports. I know that is a lot, so I promise I will have patience and really be thankful with every word of help.

The 3 templates are validating (both xhtml and css). I have replaced css files with styles in the headers, and relative links to absolute ones. I believe that posting the codes here this way will be easier if anyones prefer to download the files/codes to try. However, I will maintain copies of original (unaltered) files online, so I can modify them as you help me and have a version control.
The original templates are at this test links:
http://www.lunar.com.br/test/index.htm
http://www.lunar.com.br/test/inner.htm
http://www.lunar.com.br/test/report.htm
All of them use a default css and a specific css. The css and images folders are public, so everyone can have access to the source files.

I will post each page code in a separate post below. Hope it is not considered spam.
Thanks in advance for your time and help.
Regards,
Arthur (Brazil)

Arthur Migotto
Maringa-PR-Brazil

Father DIO once said: "Long live rock and roll!". So let it roll!

arttie_br
arttie_br's picture
Offline
Regular
Maring
Last seen: 13 years 37 weeks ago
Maring
Joined: 2006-10-16
Posts: 15
Points: 0

This is the code of

This is the code of index.htm

<?xml version="1.0" encoding="utf-8"?>


Cons

Arthur Migotto
Maringa-PR-Brazil

Father DIO once said: "Long live rock and roll!". So let it roll!

arttie_br
arttie_br's picture
Offline
Regular
Maring
Last seen: 13 years 37 weeks ago
Maring
Joined: 2006-10-16
Posts: 15
Points: 0

Inner page

This is the code for inner.htm

<?xml version="1.0" encoding="utf-8"?>


Cons

Arthur Migotto
Maringa-PR-Brazil

Father DIO once said: "Long live rock and roll!". So let it roll!

arttie_br
arttie_br's picture
Offline
Regular
Maring
Last seen: 13 years 37 weeks ago
Maring
Joined: 2006-10-16
Posts: 15
Points: 0

report.htm

This is the code for report.htm

<?xml version="1.0" encoding="utf-8"?>


Cons

Arthur Migotto
Maringa-PR-Brazil

Father DIO once said: "Long live rock and roll!". So let it roll!

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 6 years 39 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

you've put ie into quirks

you've put ie into quirks mode. Remove the xml prolog from all pages for a start. I need to question why you've broken the header image into so many small parts only to reconstruct it with floats? It should be a single background image.

arttie_br
arttie_br's picture
Offline
Regular
Maring
Last seen: 13 years 37 weeks ago
Maring
Joined: 2006-10-16
Posts: 15
Points: 0

Hi there. First of all,

Hi there.

First of all, thanks for helping. I appreciate that.
I removed the xml prolog.
The slices were an exigence of the programmer. He asked me to break the background in small pieces, with the argument that it loads faster. He also asked me to name them that way, so he can in the implementation change the images are referenced, and thus changing the whole background as needed.
As I said, I prefer liquid layouts. I am creating this also:
http://www.lunar.com.br. You can see the difference - much simpler and "fresher";
Do have any advices?
Regards,
Arthur.

Arthur Migotto
Maringa-PR-Brazil

Father DIO once said: "Long live rock and roll!". So let it roll!

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 3 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Hi Arthur Onething I notice

Hi Arthur

Onething I notice is that you have some bits floated and having margin on the horizontal plane. IE6 will not like this. As a rule, if you add float to anything, aslo add display:inline. It is nonsense to do this, but it stops IE from doubling margins (you set it to 100px and it sets it to 200px) - some bug eh?

Also, IE needs widths for floated items, or at least it often does.

arttie_br
arttie_br's picture
Offline
Regular
Maring
Last seen: 13 years 37 weeks ago
Maring
Joined: 2006-10-16
Posts: 15
Points: 0

Nice tips

Hi there,

thanks for the advices. They didn't solve the bugs yet, but it is always nice to know more bugs of IE6 implementation. Do you know where I can find a complete (or kind of) list of known bugs like those you reported me? I will also try something with conditional comments, but knowing some IE6 buggy issues first would surely make it clearer.
Thanks again.

Arthur.

Arthur Migotto
Maringa-PR-Brazil

Father DIO once said: "Long live rock and roll!". So let it roll!

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 16 hours 55 min ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9774
Points: 3856

I think you will find this,

I think you will find this, http://www.positioniseverything.net/ to be the "source of record" for IE bugs. Even MSFT referenced PIE as its list of needed bug fixes.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

arttie_br
arttie_br's picture
Offline
Regular
Maring
Last seen: 13 years 37 weeks ago
Maring
Joined: 2006-10-16
Posts: 15
Points: 0

Position is everything

Thanks for the link. I had visited this website about 8 months ago, when studying css, but didn't have the background to understand. Now I do, and the website has also grown with a lot of new stuff. Much helpful.

I just corrected "index.htm" with the info I found.
First of all, I added "position: relative;" to all the floats.
Then, I couldn't use "display: inline;" with my span elements - for they should display as blocks. To fix the doubled margins, I redeclared them with conditional comment.
The conditional comment was also used to insert hover to cells with MS proprietary expressions, and to lift the menu with (still can't understand why) negative positioning. It looks like this:


#input span {margin: 5px 0 0 5px;}
#menu {top: -87px;}
#products td {h: expression(
onmouseover=new Function("this.style.border='1px solid #6699ff';"),
onmouseout=new Function("this.style.border='1px solid #ddd';"));
}

Working in IE6 is enough for this.
I truly appreciate the help until now, and will post the corrections of inner.htm and report.htm as I progress.

Regards,
Arthur.

Arthur Migotto
Maringa-PR-Brazil

Father DIO once said: "Long live rock and roll!". So let it roll!

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 16 hours 55 min ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9774
Points: 3856

Quote:I couldn't use

Quote:
I couldn't use "display: inline;" with my span elements - for they should display as blocks.

Yeah, you still can. Anything floated is automagically a block element. The {display: inline;} is nonsensical because a float element may be only {display: block | none;}. Any other value for display must be ignored.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

arttie_br
arttie_br's picture
Offline
Regular
Maring
Last seen: 13 years 37 weeks ago
Maring
Joined: 2006-10-16
Posts: 15
Points: 0

Yeah, you were right!

Luckily you were right! I corrected almost all the bugs from the 3 layouts this way. Only specifically in the #content (from report.htm) it wasn't good, but "display: inline-block;" fixed it completely.

If no other bugs appear suddenly, this thread can be considered solved.
Thanks everyone and sorry for any inconveniences.
Best Regards,

Arthur.

Arthur Migotto
Maringa-PR-Brazil

Father DIO once said: "Long live rock and roll!". So let it roll!

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 36 weeks 2 days ago
Joined: 2004-06-30
Posts: 9668
Points: 801

arttie_br wrote: If no other

arttie_br wrote:

If no other bugs appear suddenly, this thread can be considered solved.
Thanks everyone and sorry for any inconveniences.
Best Regards,

Arthur.

Heck, that's what we're here for!

I'll mark the topic as solved, feel free to start another topic if you find any other problems Smile

Verschwindende wrote:
  • CSS doesn't make pies