Forum: Ruby on Rails A CSS issue

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
Afd161fd1de4b33cc074621572b41f0f?d=identicon&s=25 Jables (Guest)
on 2008-12-29 00:07
(Received via mailing list)
Hey,
  This question is actually more of a css issue than anything I
believe.  Hopefully that is alright, I have been posting my questions
on here for a while and figure most of the rails community is probably
familiar with css.  My website: www.uberpwner.com displays correctly
in safari and firefox, but in IE it is completely screwed.  I don't
even know where to begin to fix it.  Can anyone take a quick glance
and let me know what might be up?

Thanks,
JB
A82ba1167f4d4a8d1de63820e576a87f?d=identicon&s=25 Robby Russell (Guest)
on 2008-12-29 01:03
(Received via mailing list)
On Sun, Dec 28, 2008 at 3:06 PM, Jables <brun3797@uidaho.edu> wrote:
>
> Hey,
>  This question is actually more of a css issue than anything I
> believe.  Hopefully that is alright, I have been posting my questions
> on here for a while and figure most of the rails community is probably
> familiar with css.  My website: www.uberpwner.com displays correctly
> in safari and firefox, but in IE it is completely screwed.  I don't
> even know where to begin to fix it.  Can anyone take a quick glance
> and let me know what might be up?
>


The problem is IE and your HTML/CSS isn't working well for it. If
you're unsure, you should contact a CSS guru to help you figure out
how to work with the beast that is known as Internet Explorer.

Robby

--
Robby Russell
Chief Evangelist, Partner

PLANET ARGON, LLC
design // development // hosting w/Ruby on Rails

http://www.planetargon.com/
http://www.robbyonrails.com/
aim: planetargon

+1 503 445 2457
+1 877 55 ARGON [toll free]
+1 815 642 4068 [fax]
Afd161fd1de4b33cc074621572b41f0f?d=identicon&s=25 Jables (Guest)
on 2008-12-29 02:47
(Received via mailing list)
That is what I am hoping to find here...a css guru.  Any idea where I
might be able find one otherwise?
Bee69cfed999cd13e3bff73d472a39ee?d=identicon&s=25 Hassan Schroeder (Guest)
on 2008-12-29 02:54
(Received via mailing list)
On Sun, Dec 28, 2008 at 5:47 PM, Jables <brun3797@uidaho.edu> wrote:
>
> That is what I am hoping to find here...a css guru.  Any idea where I
> might be able find one otherwise?

On a "CSS mailing list"? (hint: see first google hit on that phrase)

Also, neither your markup nor your CSS validate. Fix those first and
then see if you still have problems to address.

FWIW,
--
Hassan Schroeder ------------------------ hassan.schroeder@gmail.com
2b891e820c238ded365d035771603f21?d=identicon&s=25 Bill Walton (Guest)
on 2008-12-29 03:05
(Received via mailing list)
Hassan Schroeder wrote:
>
> On Sun, Dec 28, 2008 at 5:47 PM, Jables <brun3797@uidaho.edu> wrote:
> >
> > That is what I am hoping to find here...a css guru.  Any idea where I
> > might be able find one otherwise?
>
> On a "CSS mailing list"? (hint: see first google hit on that phrase)
>
> Also, neither your markup nor your CSS validate. Fix those first and
> then see if you still have problems to address.

You'll find a fairly chilly reception on the list Hassan recommends if
you
go to them without first fixing your markup and CSS.  OTOH, if you've
got
your house in order, they'll absolutely tell you how, precisely, to fix
the
problem.  It's an amazing list.

HTH,
Bill
00e8233b7817ac14040f7928e6d4b889?d=identicon&s=25 John Yerhot (Guest)
on 2008-12-29 03:58
(Received via mailing list)
Check your html first. You've got quite a few unclosed tags and typos.

View the source code in Firefox and look for anything in red.
D3fe2dc4435cdd79e58d3e1380a557a1?d=identicon&s=25 Teedub (Guest)
on 2008-12-29 04:14
(Received via mailing list)
validate your CSS here
http://jigsaw.w3.org/css-validator/#validate-by-input

Validate your HTML here:
http://validator.w3.org/#validate_by_input

just paste them in and you will be told about any errors.

Good Luck
80e4cb97cae5c8d745f72337d93fd8f2?d=identicon&s=25 MaD (Guest)
on 2008-12-29 09:38
(Received via mailing list)
in addition to everything that has been said already:
- get the firefox-plugins "firebug" and "web-developers toolbar". they
are very helpful for creating and validating html- and css-code
- for internet-explorer to show your css properly try to use padding
and margin as little as possible (google for "IE margin padding" and
you will find a lot of people with problems). there are many ways to
get this to work, but no generic solution. personallly i use
transparent borders instead of padding/margin, when i encounter such a
problem.
Afd161fd1de4b33cc074621572b41f0f?d=identicon&s=25 Jables (Guest)
on 2008-12-29 10:04
(Received via mailing list)
Excellent, thanks for all the help guys.
059ed46172a087063ce26250e44c8627?d=identicon&s=25 Fernando Perez (fernando)
on 2008-12-29 11:01
MaD wrote:
> personallly i use
> transparent borders instead of padding/margin, when i encounter such a
> problem.
That's an excellent piece of advice, and it is what I also use, but it
doesn't work all the time if there is a special background. Another
problem are floating elements, try switching them from left to right and
switch the order they appear in the html, sometimes it will avoid IE
adding a double margin.
316c03a99e8ed311e5462d94f085fc2e?d=identicon&s=25 John Ivanoff (Guest)
on 2008-12-29 15:38
(Received via mailing list)
Box models

here's a handy IE toolbar
----------------------------------------------
Internet Explorer Developer Toolbar
http://www.microsoft.com/downloadS/details.aspx?fa...

I don't consider myself a guru.
In looking at your CSS there could be a lot of cleaning up done.
Example. you declare font-family in many places.
You could make a "main.css" and  do
----------------------------------------------------------------------
body {
  font-family: Geneva, Arial, Helvetica, sans-serif;
  font-size: medium;
}
----------------------------------------------------------------------

That way your fonts are the same and since you're declaring it once
less to download.
You could go further and make a "type_001.css" and just declare all
your typography in it.
When you want to change you font change the file to say "type_002.css"
that way the cached css won't be pulled and you wonder why the type
hasn't changed.

You could do the same for:
reset (http://meyerweb.com/eric/tools/css/reset/)
layout (positioning)
style (colors and other eye candy)

my 2 cents

John



On Dec 29, 4:01 am, Fernando Perez <rails-mailing-l...@andreas-s.net>
316c03a99e8ed311e5462d94f085fc2e?d=identicon&s=25 John Ivanoff (Guest)
on 2008-12-30 17:04
(Received via mailing list)
Afd161fd1de4b33cc074621572b41f0f?d=identicon&s=25 Jables (Guest)
on 2008-12-31 09:21
(Received via mailing list)
Thanks again to everyone for the top notch replies.
This topic is locked and can not be replied to.