Help me please!!

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • kevin1987
    New Member
    • Feb 2007
    • 2
    #1

    Help me please!!

    I'm very new to cs and html, trying to set up a simple page for my photography and im almost there.

    I just cant seem to insert a line break in my code properly????
    I want to insert a line break after every 5th thumbnail and have the images sit in the centre of the page.

    i'll include my css and html and hope someone will explain where im going wrong.


    CSS :

    Body {
    font: medium "Lucida Grande";
    opacity: 1;
    }

    #images {
    float: right;
    background-image: none;
    margin: 10px;
    opacity: 1;
    background-color: white;
    }

    #new {
    background-position: 0;
    text-align: center;
    color: black;
    }




    html:

    <html>

    <head>
    <title>Kevin Rowlands<p style="text-align: center;">Kevin Rowlands ~ Photography</p>
    </title>
    <link rel="stylesheet " href="Begining .css" type="text/css" />
    </head>

    <body>
    <div id="new"><img src="/Users/kevinrowlands/Desktop/site /Images/title.jpg"><div >

    <div id="images"><im g src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
    <div id="images"><im g src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
    <div id="images"><im g src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
    <div id="images"><im g src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
    <div id="images"><im g src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
    <div id="images"><im g src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
    </body>
    </html>
    Tags: None
    • ronverdonk
      Recognized Expert Specialist
      • Jul 2006
      • 4259
      #2
      You force a line break on your screen by issuing the <br /> html command after every 5th image display.

      Ronald :cool:

        Comment

        • kevin1987
          New Member
          • Feb 2007
          • 2
          #3
          Originally posted by ronverdonk
          You force a line break on your screen by issuing the <br /> html command after every 5th image display.

          Ronald :cool:

          hmmm i already tried that :( it makes two of the images pop out of place but not go under the other images, must be missing something .....

            Comment

            • drhowarddrfine
              Recognized Expert Expert
              • Sep 2006
              • 7434
              #4
              Don't have time to look into this but one problem is you are using 'id' more than once. id can only be used once per page. If you want to apply the same styles to more than one element, use 'class'.

              Also, you should consider using margins and not <br> to create space.

              And, you can only insert text in the <title>

                Comment

                • iam_clint
                  Recognized Expert Top Contributor
                  • Jul 2006
                  • 1207
                  #5
                  one thing you should consider is not putting all your images in individual divs.... the reason you are getting images popping out of place is because of the divs.

                    Comment

                    • Frinavale
                      Recognized Expert Expert
                      • Oct 2006
                      • 9749
                      #6
                      Originally posted by drhowarddrfine
                      Don't have time to look into this but one problem is you are using 'id' more than once. id can only be used once per page. If you want to apply the same styles to more than one element, use 'class'.

                      Also, you should consider using margins and not <br> to create space.

                      And, you can only insert text in the <title>
                      This person's right,

                      You should change your css to:
                      Code:
                      .images {
float: right;
background-image: none;
margin: 10px;
opacity: 1;
background-color: white;
}
                      And then change your html to refer to that class as:
                      Code:
                      ...
<div style="images"><img src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
...

                      I'm pretty sure that your problems inserting the break is stemming the fact that you have set the "float:righ t;" value for the <div>'s that hold your pictures.

                      If you want to center the images look at setting the margin's for these <div>'s instead of setting the "float" value...somethi ng like: "margin:0 auto 0 auto;"

                      Cheers
                      -Frinny

                        Comment

                        Previous template Next
                        Working...