Can't get my floats in a row...

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • cosmo_canuck
    #1

    Can't get my floats in a row...

    Hi all!

    I'm still learning the CSS ropes but am getting more ambitious by the
    day, and more confident. However a seemingly simple problem has me
    stumped. It concerns this page, from a site still in progress but
    near completion.

    Page not found - AdamAbrams.com
    http://adamabrams.com/spaprofits/media/02.html


    And the CSS is here:

    Page not found - AdamAbrams.com
    http://adamabrams.com/spaprofits/vok_07.css


    On the page in question, I thought it would be a simple matter to have
    the three elements - the menu, magazine cover and article text - line
    up side by side. The text area is floated right, and I thought the
    other two would just slide up alongside it.

    Instead though, I've ended up (for the moment) having to give the
    image a negative margin on the left and top to force it, kicking and
    screaming, into place. It's a terribly kludgy and inflexible way to
    achieve this, I know; I don't really want to do it this way... but
    hey, it works for now, and I have to show it tomorrow!

    I'm hoping someone can point out what I'm doing wrong - I'd like to
    code this correctly... and I suspect it's something simple...

    Many thanks,
    adam

    Tags: None
    • Andy Dingley
      #2
      Re: Can't get my floats in a row...

      On 3 Oct, 10:54, cosmo_canuck <adamabr...@sha w.cawrote:
      I'm still learning the CSS ropes
      Read http://brainjar.com/css/positioning/ yet?
      http://adamabrams.com/spaprofits/media/02.html
      Markups all over the place. Get a validator, fix that before even
      beginning to worry about CSS details. Trying to tweak invalid code is
      a mug's game.

      * Use a HTML 4.01 Strict doctype

      * No XML-like markup <br />

      * No IE conditional crud <!--[if IE 5]>

      * If you're going to use a WYSIWYG, don't expect it to work perfectly
      <meta name="generator " content="Adobe GoLive 6">

      * Don't use media=screen (You don't need it)

      * Don't put fake comments inside the CSS stylesheet. Why?

      * Don't link to an index page when you can simply link to the
      directory <a href="../projects/index.html">

      * WTF are ’ and — ?

      * Use <div class="bodyWrap per"rather than <div id="bodyWrapper ">
      (it makes CSS selection easier)

        Comment

        • cosmo_canuck
          #3
          Re: Can't get my floats in a row...

          On Oct 3, 3:17 am, Andy Dingley <ding...@codesm iths.comwrote:
          On 3 Oct, 10:54, cosmo_canuck <adamabr...@sha w.cawrote:
          >
          I'm still learning the CSS ropes
          >
          Readhttp://brainjar.com/css/positioning/yet?
          >
          http://adamabrams.com/spaprofits/media/02.html
          >
          Markups all over the place. Get a validator, fix that before even
          beginning to worry about CSS details. Trying to tweak invalid code is
          a mug's game.
          >
          * Use a HTML 4.01 Strict doctype
          >
          * No XML-like markup <br />
          >
          * No IE conditional crud <!--[if IE 5]>
          >
          * If you're going to use a WYSIWYG, don't expect it to work perfectly
          <meta name="generator " content="Adobe GoLive 6">
          >
          * Don't use media=screen (You don't need it)
          >
          * Don't put fake comments inside the CSS stylesheet. Why?
          >
          * Don't link to an index page when you can simply link to the
          directory <a href="../projects/index.html">
          >
          * WTF are ’ and — ?
          >
          * Use <div class="bodyWrap per"rather than <div id="bodyWrapper ">
          (it makes CSS selection easier)

            Comment

            • cosmo_canuck
              #4
              Re: Can't get my floats in a row...

              Thanks for the reply Andy, and your thorough comments on the site.
              Readhttp://brainjar.com/css/positioning/yet?
              I will now! 8^)
              * No XML-like markup <br />
              I somehow got the notion that this was superior but can't recall
              why... happy to ditch it.
              * If you're going to use a WYSIWYG, don't expect it to work perfectly
              <meta name="generator " content="Adobe GoLive 6">
              Still using GoLive on this project just for its global find-and-
              change, and uploading capabilities. As a WYSIWYG editor for CSS-based
              layouts, though, it's useless. I'm just previewing in a browser to see
              what things look like.
              * Don't put fake comments inside the CSS stylesheet. Why?
              Not sure what you mean, there's just some comments serving as headers
              to keep my sections organized... and maybe one or two from a bit of
              borrowed code... ?
              * WTF are ’ and — ?
              HTML code for the single quote mark, and the long dash, respectively.
              * Use <div class="bodyWrap per"rather than <div id="bodyWrapper ">
              (it makes CSS selection easier)
              Hmmm, how? I assumed that these "one use only" div's should be ID's
              and that the code would be pretty similar either way... am I wrong?

              Thanks again!
              adam

                Comment

                • cosmo_canuck
                  #5
                  Re: Can't get my floats in a row...

                  Thanks for pointing me in the right direction, and for the very clear
                  breakdown of float behaviour. My hope is restored!

                    Comment

                    Previous template Next
                    Working...