There's no such thing as a stupid question, but they're the easiest to answer.
JoinTour
Login
 
Tag Cloud
access audio avg avg 8 bios blue screen boot bsod computer connection cpu crash css dell desktop dma driver drivers dvd email error excel explorer firefox firefox 3 freeze gimp graphics hard drive hardware hijackthis hjt install internet internet explorer itunes keyboard laptop macro malware monitor motherboard network networking outlook outlook 2003 outlook 2007 outlook express pio problem problems router seo server slow sound sp3 spyware trojan usb video virtumonde virus vista vundo windows windows vista windows xp winxp wireless
Web Design & Development
Search
Search in:
 
Advanced Search
Tech Support Guy Forums > Internet & Networking > Web Design & Development >
Staff Profile Page


HELLO AND WELCOME! Before you can post your question, you'll have to register -- it's completely free! Click here to join today! We highly recommend that you print a copy of our Guide for New Members. Enjoy!

 
Thread Tools
RTHaworth's Avatar
Member with 97 posts.
 
Join Date: Jul 2005
18-Jul-2008, 08:41 AM #1
Staff Profile Page
I want to creat a page profiling key members of staff - qualities and interests.

So i think i want to create a div or something within the body of the page that has a small passport size photo floated out to the right or left, with text flowing along one side of the picture. I suppose i could use a table but prefer to use CSS. Any ideas how to do it?
TheRobatron's Avatar
Computer Specs
Senior Member with 415 posts.
 
Join Date: Oct 2007
Location: England
Experience: Intermediate
18-Jul-2008, 11:07 AM #2
I would do it like this:

HTML Code:
<div class='profile'> <p class='center'><img src='pic.gif'></p> <p>Text about them goes here.</p> </div>
CSS:
Code:
p.center {
text-align: center;
}

div.profile {
width: 200px;
border: 1px #000 solid;
}
That would place the image above the text and centred, but if you wanted it on the left or right you could do this: (for this I'll put the image on the left and assume that the image is 50 pixels wide)

HTML Code:
<div class='profile'> <img src='pic.gif' class='left'> <p class='profiletext'>Text about them goes here.</p> </div>
CSS:
Code:
p.profiletext{
text-align: left;
margin-left: 55px;
float: left;
}

img.left {
float: left;
}

div.profile {
width: 200px;
border: 1px #000 solid;
}
I hope that does what you want
__________________
Gone on holiday, be back on 29th

There's no place like 127.0.0.1

RTHaworth's Avatar
Member with 97 posts.
 
Join Date: Jul 2005
18-Jul-2008, 03:32 PM #3
hey theRobatron. I havent had chance to test that yet but just want to say that its really good of you to do that, very kind of you. Ill let you know how it goes and if i end up using your code on my finished site ill put ur name in a HTML comment
TheRobatron's Avatar
Computer Specs
Senior Member with 415 posts.
 
Join Date: Oct 2007
Location: England
Experience: Intermediate
18-Jul-2008, 06:11 PM #4
No problem Let me know if there's anything wrong with the code because I haven't really tested - it should work in theory though
Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are Off
Refbacks are Off

You Are Using:
Server ID
Advertisements do not imply our endorsement of that product or service.
All times are GMT -4. The time now is 10:14 PM.
Copyright © 1996 - 2008 TechGuy, Inc. All rights reserved.
Powered by vBulletin, Copyright © 2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.1.0
Powered by Cermak Technologies, Inc.