Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 17
  1. #1
    New Coder
    Join Date
    Sep 2004
    Location
    Guadalajara, Mexico
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry whats wrong with netscape?

    I dont get it, why does netscape messes up with my code, it looks great on IE but when I test it at netscape, even the break space tags are bigger than at IE, this happends specially when I use the "float: left or rigth" tags, and it happends on several pages, I use them as something like this:

    Code:
    <div class='boxyl' style='margin-left:2px; margin-right:1px;'>
    Some content
    </div>
    
    <div class='boxyr' style='margin-left:1px; margin-right:2px;'>
    Some content
    </div>
    This is the style sheet

    Code:
    .boxyl {
    	float: left;
    }
    .boxyr {
    	float: right;
    }
    Am I missing something here?, because I've seen many places that use them as this and their pages look ok,

  • #2
    Senior Coder
    Join Date
    Apr 2003
    Location
    San Francisco, CA
    Posts
    2,469
    Thanks
    0
    Thanked 0 Times in 0 Posts
    What version of netscape and what version of IE? if you're doing old netscape 4, then you're right, it was too old. If you're talking new netscape, you're wrong, IE is doing it wrong.

    IE is forgiving, so it will let bad habits work. Mozilla builds will not -- in short, you're writing your code wrong. You will need to define a width on the object for your float to work... but for us to gauge it 100% accurately, we need to see a link to your full page with all the code - for all I know you have different floating and positiong elements running around.
    // Art is what you can get away with. <-- Andy Warhol
    ...:.:::: bradyjfrey.com : htmldog : ::::.:...

  • #3
    Regular Coder
    Join Date
    Jan 2004
    Location
    Maryland
    Posts
    468
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Floats need widths.

  • #4
    New Coder
    Join Date
    Sep 2004
    Location
    Guadalajara, Mexico
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    My IE version its 6.0.28..., and my Netscape version is 7.0.

    I didn't know about the widths in the float tag, could you show me a complete example of the style? also is it ok to use margins to vertically align it?

    One of the pages that are giving me troube is this (Edit: "Link Removed per user request") there are a couple of more pages with this problem, but I guess that by solving one, I will be able to solve the others.

    Since I'm using the e107 CMS you should know that I'm making just the main content part of the page, so here's the (Edit: "Link Removed per user request") to it (its a text file with the exact content I made and not with the rest of the layout), notice that I'm using single qoutes because its on a PHP page

    Again I only have trouble with the MAIN content area (the BIG box) and NOT with the page layout (menus, header, footer, etc), the second link shows the code I made for the CONTENT.

    Also what about the "<br />" tags? why are they bigger at netscape, I mean, if I have 2 line breaks it shows as they were 3 or 4 at netscape, any ideas on this?
    Last edited by sage45; 10-04-2005 at 05:43 PM.

  • #5
    Regular Coder
    Join Date
    May 2004
    Location
    San Jose, CA
    Posts
    388
    Thanks
    0
    Thanked 0 Times in 0 Posts
    http://glish.com/css/9.asp
    The content on the left side is placed using "float: left;" and there's a width on that ("width: 67%;"). That width can be any unit (%, px, em).

    Also, you don't need to float one to the left and one to the right. You only need to float one of the boxes. The other box will line up next to the float, just like in the Glish example above. The right content on that page doesn't have a float applied. Think of it as if you are placing one item to the left of another item; that other item just sits there.
    -ts

    P.S. If your link is a PHP page, change the extension from ".txt" to ".php" or ".phtml" so we can all see the actual page and not just the source. And welcome to the forums, in case no one has said so!
    -Challenge The Status Quo
    -www.toddseal.com/rodin

  • #6
    New Coder
    Join Date
    Sep 2004
    Location
    Guadalajara, Mexico
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thanks tsguitar2004

    I did gave a link to the php page, its the first link I put and the second link is a link to a txt file with the main content of the PHP file so that you can see exactly what I DID, like I said I'm using the CMS e107 so I just "created" the main content part, the rest of the layout is basicly just customized by myself but I didnt created it.

    Also, you are saying that I just need to float one box to the left/right of the other one, but then again, how do I make that content "box" to just be on the left or right side of some specific content, and then add some more under all that but independant of the box, like I do on most of my pages.

    Now I'm even more comfused because I saw this 2 boxed example at one page on the pinned topics of this forum.

  • #7
    Regular Coder
    Join Date
    May 2004
    Location
    San Jose, CA
    Posts
    388
    Thanks
    0
    Thanked 0 Times in 0 Posts
    http://css.maxdesign.com.au/floatuto...torial0816.htm
    That link looks like what you are describing. See if that helps any. Oh! And I did see your first link later. Got it. Thanks for that. CMS e107 means nothing to me, so I don't know what you're dealing with over there. I use Notepad for my page creation.

    You determine which box will be the floating on and float it right or left, depending on what you want. You decide which content <div> will float and on which side it will float.

    After your floated content, create a new <div> that has "clear: both;" in its CSS. That will put that <div> under the floated stuff. So...
    Here's the markup:
    Code:
    <div id="leftcontent">
    <p>blah blah blah</p>
    <div id="rightcontent">
    <p>blah blah blah</p>
    <div id="bodycontent">
    <p>blah blah blah</p>
    And now the CSS:
    Code:
    #leftcontent
    {
    float:left;
    width:200px;
    }
    
    #rightcontent
    {
    /* you don't need to say anything here 
    since this will automatically be on the right 
    of that other content you've floated to 
    the left */
    }
    
    #bodycontent
    {
    clear: both;
    }
    -ts

    P.S. Whoa... I know Float-Fu... *I'm* acutally explaining how float works. This is weird.
    -Challenge The Status Quo
    -www.toddseal.com/rodin

  • #8
    New Coder
    Join Date
    Sep 2004
    Location
    Guadalajara, Mexico
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    dude , you are not getting what I'm saying, I dont need it for the layout of my page, I'm using it within my main content, which means what you see on the big box only.

    That is why I showed you specifically the part that I'm making, which is the main content on the txt file.

    When I talk about the Content Manage System called e107 (sort of like phpnuke) I mean that the only thing I'm making is the main area since the layout is already there.

    Anyway, heres a quick html page of the main content only, so that you get what I mean... (Edit: "Link Removed per user request").
    Last edited by sage45; 10-04-2005 at 05:44 PM.

  • #9
    Senior Coder
    Join Date
    Apr 2003
    Location
    San Francisco, CA
    Posts
    2,469
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by lalo
    dude , you are not getting what I'm saying, I DONT NEED IT for the layout of my page, I'm using it within my MAIN CONTENT, which means what you see on the big box only.

    That is why I showed you specifically the part that I'm making, which is the MAIN CONTENT on the txt file.

    When I talk about the Content Manage System called e107 (sort of like phpnuke) I mean that the ONLY thing I'm making is the main area since the layout is already there.

    Anyway, heres an html page of the main content only, so that you get what I mean... (Edit: "Link Removed per user request").
    I think he was doing you a favor, which probably means you shouldn't yell at him -- he's the one helping you out, so do us both a favor and be a little more nice. The reason for the confusion is that your description isn't 100% specific, since your code is a bit wacky.

    1) why are the break tags bigger or smaller? Because that's how each company represents them. Ironically the break tags in Mozilla/Netscape builds, Safari, and Opera are the same, it's IE who has it different... so I wonder who's got it wrong? You shouldn't be using break tags anyway, CSS can do just the same without it. Instead of using three break tags above div class='textodoble', why didn't you just give that class a large top margin or padding? That would be cross browser perfect.
    2) Are you trying to float the images + float the text next to it around those images? They are a muddled mess, you'd need to separate them better and code it. There are plenting of examples of float elements that work, I use them on my home page:
    (Edit: "Link Removed per user request")

    I use it on just about everysite I do, and every CSS site I see has them, check out (Edit: "Link Removed per user request")

    Tell me for sure which elements you want to float, and their id or class name, because everything is too blended together, unsemantic, and nested in a div or a paragraph to make logical sense to me. You also need to define a doctype (unless you are just using old HTML code, but it still would be recommended -- but you are not as I see you closed your break tags, so a doctype is an absolute MUST). Here are all your current errors:
    (Edit: "Link Removed per user request")
    Last edited by sage45; 10-04-2005 at 05:42 PM.
    // Art is what you can get away with. <-- Andy Warhol
    ...:.:::: bradyjfrey.com : htmldog : ::::.:...

  • #10
    New Coder
    Join Date
    Sep 2004
    Location
    Guadalajara, Mexico
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    bradyj I dint meant to yell at him, I only used it to enfatize what he didn't understand about what I had already mentioned before (I'll use bold text from now on sorry).

    And no I didnt use a doctype because if you have read everything I had said you would have found out that its just a quick html version of what my php file actually says so that you guys would know exactly what I'm talking about since tsguitar2004 thought I was talking about the layout (which I'm not) when I'm only refering to the main content part, I already gave a link to the whole page, the php content page and even that html with the main content in it.

    I use break tags because some people (at some of the css links pinned at this forum) say we should use them, and since everyone says different stuff, now I just dont know who to believe

    Also, are you seeing my page with IE, mozilla, netscape or what?? besides its pretty clear (or at least I though, I said it at the first post) that what comes within the "boxyl" is supposed to be floating to the left and what comes at the "boxyr" goes to the right, everything else should just be normally displayed above or below those "boxes".

    Sorry, but I get frustrated when people try to help me without even reading the whole threat at least when I do manage to help someone else I read ever single word so that I dont get it wrong.

  • #11
    Senior Coder
    Join Date
    Apr 2003
    Location
    San Francisco, CA
    Posts
    2,469
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I figured it was those two boxes, but I had noticed some other errors -- the reason why you need to put a doctype in right now is because we cannot properly test -- if you're writing XHTML code, but not giving it that doctype, it will render differently in browsers -- that's all I'm saying, that it's important to pop in even for testing purposes so that you can gauge if it looks properly. I'm on a Mac, so I cannot test in IE for PC, but because of coding errors it shows up differently in IE for Mac, Safari, Firefox, and Opera.
    // Art is what you can get away with. <-- Andy Warhol
    ...:.:::: bradyjfrey.com : htmldog : ::::.:...

  • #12
    New Coder
    Join Date
    Sep 2004
    Location
    Guadalajara, Mexico
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok, so I wrote the doctype and replaced the single quotes (I used them because it was a php page) with double quotes. I also uploaded a (Edit: "Link Removed per user request") of what I want it to look like (taken using IE). Heres the (Edit: "Link Removed per user request") again, and this is the (Edit: "Link Removed per user request") with layout as well

    Also I just installed firefox, and I was wondering if I start using it to design the pages (I mean to browse my pages in it) and if it looks OK there, does that means taht it will look ok at IE, Netscape, and others? Or at least better than when I was first testing it at IE.

    Anyway I dont think that this website will be visited using many different browsers, because since this is a website intended for doctors (in dentistry, etc) they will probably wont be using browsers other that IE and netscape, because we've seen that most of them are just getting into the computers world or they have basic knowledge to simply check emails and stuff like that. (Is for my mom's website btw, Its a mexican business mainly of digital radiology, the first designer did a terrible job on the website, even worst than me and I didnt even studied programming, but I guess you already knew that)

    Probably I need to keep on reading all those tuts again but thanks and i hope someone could give me something to get an idea on how to solve this design problem
    Last edited by sage45; 10-04-2005 at 05:44 PM.

  • #13
    Regular Coder
    Join Date
    May 2004
    Location
    San Jose, CA
    Posts
    388
    Thanks
    0
    Thanked 0 Times in 0 Posts
    1) I read the whole thread. By the time I responded, "the whole thread" was a mere 4 posts long. I get frustrated when people butt into a conversation without any context, so I make sure to do that when I join a conversation.

    2) All those <br>s used for layout cause issues in figuring out what's what in your code. Also, the seemingly nonsense names of the <div>s makes it difficuly, too. Mayhap those names mean something to you, which is valuable and the point, but it's not intuitive when you have so many divs and classes.

    3) I just re-read this thread and I *still* don't see you explaining your problem clearly.

    4) When I view the page in NS7.1/pc, it looks like you've got float issues. Attached is my best attempt. Your CSS is terribly cluttered and not easy to wade through. Essentially what I did was add a float: left to each of the two images. In order for the content below it to actually appear below and not on top of it, I added a <div style="clear: both;"></div>. Now the browser knows that the floating is over and the rest of the content flows like normal.

    5) You *really* need to clean up the code on this one. Friendly code makes people like me want to help. Ugly, nasty-looking code frightens people like me. It just so happens that I was in a brave mood tonight. I need to go eat. I think what I've given you addresses your concerns here. I moved some of your inline styling to the CSS, so you'll notice some of it missing. This layout looks like what you want in IE6/pc and NS7.1/pc.

    6) What I didn't understand was in a failure to communicate what you wanted. When you say "main content area" in reference to code as convoluted as you have, with accompanying muddled CSS, I don't know what you mean by that. I was looking for a <div id="maincontent"> but didn't find that. If you have something you refer to as the main content, lable the div as such. Now, I don't want to get into a spitting match over this, but in the future, simply restate what you want done, only use different words. That image would have been helpful up front. If you can't state what you want clearly, the only person to be frustrated with is you. We are trying our best here to understand what people want.

    7) You'll also notice that what I suggested originally is *exactly* what I did here to make this work, unless I have it all wrong still. If you're not sure how to implement a suggestion, that doesn't make it wrong. Ask.
    -ts

    P.S. Oh. And welcome to the forums, in case no one has said so...
    Attached Files Attached Files
    -Challenge The Status Quo
    -www.toddseal.com/rodin

  • #14
    New Coder
    Join Date
    Sep 2004
    Location
    Guadalajara, Mexico
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok, it worked

    and yes it was what you had already mentioned, only that I had never heard of the
    Code:
    <div style='clear: both;'></div>
    that is why I thougth it wouldn't work (do you know somewere I can learn more about it?)

    anyway... thank you, thank you, thaaaank you

    Btw next time, I will provide as much info as I can so that this doesn't happens again. And yes my code and classes names are weird and messy, but since I'm just learning CSS I'm doing a lot of testing and that is why there are sooo many classes and style names in the stylesheet, besides some of them are in spanish, thats why you didnt understood them. But I will clean it asap.

    Once again I apologize for seem rude even If that was not my intention.


    P.S. thanks I had already been welcomed to the forums, but it never hurts.

  • #15
    New Coder
    Join Date
    Sep 2004
    Location
    Guadalajara, Mexico
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    btw, is it true or not that I need to set the width for the float elements? I mean, it did worked without it, but someone here said it was needed.

    I just want to clear that out before I do something wrong again.

    Also, like I asked before, if I preview my website with firefox first instead of IE while editing, will that make it less possible to look bad on both of them and Netscape as well?


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •