Membership is FREE – with unlimited access to all features, tools, and discussions. Premium accounts get benefits like banner ads and newsletter exposure. ✅ Signature links are now free for all. Share your own thoughts and experience, accounts may be terminated for violations.
  • Welcome to AcornDomains.co.uk, a friendly community for UK domain investors, developers and anyone interested in domain names.

    Whether you're looking to buy or sell domains, learn more about the UK domain market, get feedback on your names, or simply chat with other domainers, you're in the right place. AcornDomains has been bringing together people from across the UK domain industry for many years, from complete beginners to experienced investors.

    Have a look around, join the discussions and, if you haven't already, create a free account and introduce yourself.

photo alignment text wrap problem

Status
Not open for further replies.
Joined
Nov 25, 2006
Posts
2,686
Reaction score
27
This is doing my nut in .....

I have a page that has bios of several people.

Each bio has a pic, aligned left at the start of each paragraph HOWEVER when you add more than one pic to the page it screws up the alignment with all the pics going diagonally across the page rather than each one aligning on the left.

Help or solution to this v. much appreciated and beer tokens to whoever gets it sorted or charity donation.

cheers

Howie
 
Sounds like something to do with "floats" and "clearing"? Hard to say without seeing anything - you could try strategically placing the following after each bio to test:

HTML:
<br style="clear:both; margin: 0; padding: 0;" />
 
This is doing my nut in .....

I have a page that has bios of several people.

Each bio has a pic, aligned left at the start of each paragraph HOWEVER when you add more than one pic to the page it screws up the alignment with all the pics going diagonally across the page rather than each one aligning on the left.

Help or solution to this v. much appreciated and beer tokens to whoever gets it sorted or charity donation.

cheers

Howie

Sounds like you've got <div>s adding together going down the page. Try clearing the relevant CSS between each picture using something like:

<div class ="resetcss"></div>

Then add this to the page CSS:

.resetcss {
clear: left;
font-size: 0px;
line-height: 0;
margin: 0px;
padding: 0px;
}
 
Sounds like something to do with "floats" and "clearing"? Hard to say without seeing anything - you could try strategically placing the following after each bio to test:

HTML:
<br style="clear:both; margin: 0; padding: 0;" />

Sounds like you've got <div>s adding together going down the page. Try clearing the relevant CSS between each picture using something like:

<div class ="resetcss"></div>

Then add this to the page CSS:

.resetcss {
clear: left;
font-size: 0px;
line-height: 0;
margin: 0px;
padding: 0px;
}

Nice one :D

Between you both you've sorted the problem.

Tokens or charity? (if latter name it)

TVM

Howie
 
Status
Not open for further replies.
Top Bottom