www.webdeveloper.com
Results 1 to 8 of 8

Thread: Layout Issues in CSS? ...

  1. #1
    Join Date
    Dec 2007
    Location
    Kelowna, BC
    Posts
    100

    Question Layout Issues in CSS? ...

    Hi Folks,

    I started working on a "refurb" over the last month, as I am new to CSS (all previous web stuff built in table structures). I tried the validator, which threw up a couple of float errors, so I fixed them first, before creating this topic.

    Now ... I had a go at rebuilding our home page using CSS, which was going quite well in my HTML editor (preview) .. but once I went live (temp file of course) ... it looked a complete mess. Funny thing was, with Compatibility Mode switched on in IE, all looked fine, as I viewed in editor while coding, but in normal IE mode or other browsers, such as Firefox, Chrome etc, it looks a complete mess!!!!

    I am sure it's my lousy beginner's approach, but some direction where I am fundamentally going wrong would be greatly appreciated (please go easy on my 'far from perfect' coding with CSS)


    Here in my working file link:
    http://www.okanaganforum.com/index2013DIVS.html

    All the best,
    Cal
    Visiting or Relocating to the Okanagan Valley...
    http://www.okanaganforum.com

  2. #2
    Join Date
    Aug 2006
    Posts
    1,902
    Cal, I'm not sure what validator you're using, but the one at W3C shows 273 errors and 8 warnings for your page.

    From the looks of it, I'm guessing you have some issues with the box model, trying to put boxes that are too large into other boxes, causing them to shift to the bottom of the page.

    Dave

  3. #3
    Join Date
    Dec 2007
    Location
    Kelowna, BC
    Posts
    100
    Hi there tracknut .. and thank you for your reply!

    I mainly ran the CSS validator, as this is the area of coding I am trying to learn. I know the HTML valildator typically throws up a ton of errors, which I normally fix closer to completion of each individual web page.

    On the CSS front, I tried to reduce the width of both sets of column divs, but no joy, as the right hand divs are still jumping out of position at the bottom of the page. For stacking left hand column divs, it was suggested to me to use the "clear: all" tag, which worked well, but I am now wondering if that is part of the issue, causing other left hand column divs to jump out of position (rather than landing side by side horizontally?)

    Anyway, thanks for your input - looks like I have lots more headscratching and testing to do.

    All the best,
    Cal
    Visiting or Relocating to the Okanagan Valley...
    http://www.okanaganforum.com

  4. #4
    Join Date
    Dec 2007
    Location
    Kelowna, BC
    Posts
    100
    .. I think I am on the right track now, so please consider this query solved.

    All the best,
    Cal
    Visiting or Relocating to the Okanagan Valley...
    http://www.okanaganforum.com

  5. #5
    Join Date
    Mar 2011
    Location
    The Pleiades
    Posts
    31
    It's no good having valid CSS which is working with invalid HTML. It's bound to cause issues. I think you should get both your HTML and CSS as near to validity as possible then at least you know it isn't down to a coding error.

    Kind regards,

    LC.

  6. #6
    Join Date
    Dec 2007
    Location
    Kelowna, BC
    Posts
    100
    I hear ya LC!

    I certainly will run a pass with the HTML validator and understand which tags/routines need to be addressed. Once I have everything in place, I will then proceed to re-work all our site pages. At this point, getting my head around CSS (Divs) is the key focus, then everything else will be approached.

    All the best,
    Cal
    Visiting or Relocating to the Okanagan Valley...
    http://www.okanaganforum.com

  7. #7
    Join Date
    Mar 2011
    Location
    The Pleiades
    Posts
    31
    The errors and warning are pretty much explanatory. They give the tag and also which line the error is on!

    If you get absolutely stuck, post your code and ill have a go at uploading it to the validators and validating it for you.

    Kind regards,

    LC.

  8. #8
    Join Date
    Dec 2007
    Location
    Kelowna, BC
    Posts
    100
    Thanks for the feedback LC!

    This is where I am now ... 32 Errors & 3 Warnings. All that's left is iframes and flash elements, which kick up around 7-10 errors per line. I now know that iframes and Flash export HTML don't work with XHTML Strict Doctypes, so, if I manage to correct them, I am sure I will be down to around 8-10 unique code/tag errors.

    All the best,
    Cal
    Visiting or Relocating to the Okanagan Valley...
    http://www.okanaganforum.com

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles