By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,394 Members | 1,912 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,394 IT Pros & Developers. It's quick & easy.

Help me please!!

P: 2
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"><img src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
<div id="images"><img src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
<div id="images"><img src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
<div id="images"><img src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
<div id="images"><img src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
<div id="images"><img src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
</body>
</html>
Feb 18 '07 #1
Share this Question
Share on Google+
5 Replies


ronverdonk
Expert 2.5K+
P: 4,258
You force a line break on your screen by issuing the <br /> html command after every 5th image display.

Ronald :cool:
Feb 18 '07 #2

P: 2
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 .....
Feb 18 '07 #3

drhowarddrfine
Expert 5K+
P: 7,435
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>
Feb 18 '07 #4

iam_clint
Expert 100+
P: 1,208
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.
Feb 19 '07 #5

Frinavale
Expert Mod 5K+
P: 9,731
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:
Expand|Select|Wrap|Line Numbers
  1. .images {
  2. float: right;
  3. background-image: none;
  4. margin: 10px;
  5. opacity: 1;
  6. background-color: white;
  7. }
  8.  
And then change your html to refer to that class as:
Expand|Select|Wrap|Line Numbers
  1. ...
  2. <div style="images"><img src="/Users/kevinrowlands/Desktop/site /Images/new2.jpg"></div>
  3. ...
  4.  

I'm pretty sure that your problems inserting the break is stemming the fact that you have set the "float:right;" 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...something like: "margin:0 auto 0 auto;"

Cheers
-Frinny
Feb 19 '07 #6

Post your reply

Sign in to post your reply or Sign up for a free account.