>>CSS << Problems: line thickness/DIV positionin

  • polarbear84
  • Newbie
  • Newbie
  • polarbear84
  • Posts: 5
  • Loc: Buenos Aires, Argentina

Post 3+ Months Ago

:shock: This particular issue is driving me crazy.
I'm designing a set of tickets for an online distribution system, but when I view the same styled HTML on IE6 and Mozilla, for instance (it also differs on the same values with Konqueror), line widths, DIV positionings and also font-heights are ignored, applying arbitrary settings;
There are tables placed inside DIVs, and each td of each table is styled with font-size, font-height and border settings, but they are ignored (Mozilla) or displaced.
Also, DIVs on Linux seem to be opaque, not transparent like in IE6.

I'd appreciate some help, because I'm really stuck with this :(
Thanks in advance!

Carlos Vergara
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

You might want to post some code or a link for everyone to take a look at.

With tables, I always write a style def for TD's like so...
Code: [ Select ]
TD{font-family:sans-serif;font-size:10px;color:#444;}
  • Hacker007
  • Proficient
  • Proficient
  • User avatar
  • Posts: 371
  • Loc: Riverside, CA

Post 3+ Months Ago

Quote:
I'm designing a set of tickets for an online distribution system

Well if your just having them print tickets i can see your problem. All the tickets would look diffrent.(font, size, ect.)
If that is the case (which is what i got from the post) I would say to make the ticket an image to print.

But that is just a solution to what i thought was the problem, you should link us to better explaine the problem. :roll:
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1855
  • Loc: Uk

Post 3+ Months Ago

The problem with your css should be quite simple to fix, but we do need some code or a link as a sample to go on from.
  • polarbear84
  • Newbie
  • Newbie
  • polarbear84
  • Posts: 5
  • Loc: Buenos Aires, Argentina

Post 3+ Months Ago

Sorry... I forgot to post some code;
here it comes:
Code: [ Select ]
 <tr>
  <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
  <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
  <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
  <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
  <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
 </tr>
  1.  <tr>
  2.   <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
  3.   <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
  4.   <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
  5.   <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
  6.   <td style="font-family:sans-serif;border:2px solid black; font-size:9pt;">&nbsp;</td>
  7.  </tr>

since I was unable to group those settings under a class <believe it or not, neither mozilla nor Konqueror obeys that> I copied-pasted the style for each cell. The thing is here: Mozilla prints that 2 pixels as some kind of bevel, and Konqueror prints the same code as an extremely bold line; IE6 prints the 2px line I'm used to... but I'm trying to make it multibrowser.



Code: [ Select ]
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="font-size:9pt; font-family:sans-serif; border:2px solid black;">
 <tr>
  <td style="font-family:sans-serif; font-size:6pt; border-bottom:1px solid black;height:33%">Anticipo:<b><?echo($mes);?></b>
   &nbsp;&nbsp;&nbsp; Año:<b><?PHPCODEhere?></b> </td>
 </tr>
 <tr>
  <td style="font-family:sans-serif; font-size:9pt;height:33%"><strong>Vencimiento:
   <?echo($fv);?> </strong> </td>
 </tr>
</table>
  1. <table width="100%" border="0" cellspacing="0" cellpadding="0" style="font-size:9pt; font-family:sans-serif; border:2px solid black;">
  2.  <tr>
  3.   <td style="font-family:sans-serif; font-size:6pt; border-bottom:1px solid black;height:33%">Anticipo:<b><?echo($mes);?></b>
  4.    &nbsp;&nbsp;&nbsp; Año:<b><?PHPCODEhere?></b> </td>
  5.  </tr>
  6.  <tr>
  7.   <td style="font-family:sans-serif; font-size:9pt;height:33%"><strong>Vencimiento:
  8.    <?echo($fv);?> </strong> </td>
  9.  </tr>
  10. </table>

another particular case; neither mozilla nor Konqueror displays anything smaller than 6pt, but I NEED them to be that size, those are the specifications provided.

And sorry again, my english skills are not the best. What I am building is basically a massive impositive bill, that's why it CAN'T differ from browser to browser, at least not so much[/quote]
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1855
  • Loc: Uk

Post 3+ Months Ago

Hey I've just got back from work. Firstly, your english is a lot better than may people I know from ingland :) so don't wory bout that. I have never once had a problem using classes in css, in any browser.

Now I've got the time I'm going to have a look at the code and see what I can come up with to sort out the compatibility for you. Be back to you in a moment.
  • Hacker007
  • Proficient
  • Proficient
  • User avatar
  • Posts: 371
  • Loc: Riverside, CA

Post 3+ Months Ago

Oh, are you adding in php? :wink:
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1855
  • Loc: Uk

Post 3+ Months Ago

The php is irrelevent.

Ok as for browser compatibillity, here is what a get using your code:

http://www.geocities.com/whataloadof_crap/screenshots.png
(you will have to copy-paste the link)
The red box shows, in firefox, what I get when i edit your code to the following:

Code: [ Select ]
<table>
    <tr>
  <td class="ClassName">&nbsp;</td>
  <td class="ClassName">&nbsp;</td>
    <td class="ClassName">&nbsp;</td>
    <td class="ClassName">&nbsp;</td>
    <td class="ClassName">&nbsp;</td>
 </tr>
</table>
  1. <table>
  2.     <tr>
  3.   <td class="ClassName">&nbsp;</td>
  4.   <td class="ClassName">&nbsp;</td>
  5.     <td class="ClassName">&nbsp;</td>
  6.     <td class="ClassName">&nbsp;</td>
  7.     <td class="ClassName">&nbsp;</td>
  8.  </tr>
  9. </table>


and then place this style in the head:

Code: [ Select ]
<style>
td.ClassName{
    font-family:sans-serif;
    border:2px solid black;
    font-size:9pt;
}
</style>
  1. <style>
  2. td.ClassName{
  3.     font-family:sans-serif;
  4.     border:2px solid black;
  5.     font-size:9pt;
  6. }
  7. </style>


as you can see it is all the same.....

I really can't see how you are having a problem with this.

As for the font-size issue. mozzilla/firefox/netscape all have a font zoom feature that cannot be overridden (for accessibility reasons). Therefore no matter what you do, you will never be able to set the font so that everyone will see it the same.
Additionally, a generic sans-serif font will not necessarilly display the same size in al browsers when set to the same size in code, due to different fonts being used.

Sorry I was not anymore help, but I cannot see the problem. Maybe a screenshot of what you see?

BTW is 6pt even legible?
  • polarbear84
  • Newbie
  • Newbie
  • polarbear84
  • Posts: 5
  • Loc: Buenos Aires, Argentina

Post 3+ Months Ago

rtm;
answering to your question...
it is not supposed to be readable for a person, but it's a verification code that CAN (I've tried it) be read with a sybol scanner (a sort of hand scanner).
I'll supply screenshots soon, but imagine every td with a black "bevel" effect, very disgusting
  • polarbear84
  • Newbie
  • Newbie
  • polarbear84
  • Posts: 5
  • Loc: Buenos Aires, Argentina

Post 3+ Months Ago

sorry... my boss doesn't allow this traffic to be published; as soon as I can bypass censorship I'll supply something

Post Information

  • Total Posts in this topic: 10 posts
  • Users browsing this forum: No registered users and 40 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.