BooZker
Aug 6 2007, 07:57 PM
OK so I want to put the images on: http://boozkerstweaks.trap17.com/oscargods...photography.php (long URL for testing) inside the div with the yellow dashes (put those there just until I can get the images inside) I don't know why they are breaking out though. It's most likely to do with the float: left. I tried the clear:both but that does nothing. I want it to look just like that, but inside my div with the yellow dashes. All the CSS for the gallery images is at the bottom of my style sheet found here: http://boozkerstweaks.trap17.com/oscargodson/style.cssTake a gander and see if you know how to fix it. I have been trying to fix this for a couple days now, so ANY help would be great. UPDATE: Just noticed it does it with this also: http://boozkerstweaks.trap17.com/oscargodson/client_work.phpMaybe a block element problem? Maybe not a problem with floats, but ul and li? Because the gallery is made from an ul.
Reply
jlhaslip
Aug 6 2007, 08:15 PM
Had a quick peek. Find : CODE <p class="main_text"/> and remove the slash at the end of that tag. The paragraph is closing because of the slash. Might be the problem. (?) Post back if it doesn't work. *edit* Just an idea, but if you are planning to attract potential customers from this site, I would consider changing your Myspace user name, or start a new page on Myspace. That name you are using now will really not present a good image for the client to see. Must be a story to be told about that one... 
Reply
BooZker
Aug 6 2007, 08:29 PM
I'm at work so i can't tell you the story behind the username, but i will on the next post! I actually just got rid of that p tag. I don't need it. That was leftover from the template. I only need that UL. And it still isn't working... any ideas?
Reply
truefusion
Aug 6 2007, 08:37 PM
It is 'cause it is floating to the left. Suggestion: Instead of this: HTML <ul>
<li><a><img></a></li>
<li><a><img></a></li>
<li><a><img></a></li>
<li><a><img></a></li>
<li><a><img></a></li>
<li><a><img></a></li>
</ul> Do this: HTML <ul>
<li><a><img></a></li>
<li><a><img></a></li>
<li><a><img></a></li>
</ul>
<ul>
<li><a><img></a></li>
<li><a><img></a></li>
<li><a><img></a></li>
</ul>
<ul>
<li><a><img></a></li>
<li><a><img></a></li>
<li><a><img></a></li>
</ul> Don't have it all into one unordered list. This should make your job easier, even if it's more table-like. Then mess around with CSS for the new coding.
Edit: Here's the modified CSS HTML .thumb_container {
margin: 0 auto;
width: 430px;
border: 1px dashed #ffff00;
}
ul.thumb_list li.thumb_list {
list-style: none;
display: inline;
}
.thumbs {
border: 3px solid #ffffff;
border-bottom:6px solid #ffffff;
height:70px;
width:100px;
margin:5px;
}
Reply
BooZker
Aug 6 2007, 08:45 PM
I did that, and yes it's inside the box, but I need to float the images left to make them align horizontally. If i keep float left, but make it in multiple ul it looks the same as before. Breaks out of the div... oh well... any more ideas haha
Reply
truefusion
Aug 6 2007, 08:50 PM
Not on my side. Did you copy the CSS i just edited in? On my side, with the way i just said to do it, it does not break out of the yellow box and should look the way you want it to.
Reply
jlhaslip
Aug 6 2007, 08:53 PM
CODE <ul class="thumb_container"> <li class="thumb_list"><a href="http://www.boozkerstweaks.trap17.com/oscargodson/artwork/personal/art/photography/Abandonment.jpg" rel="lytebox[photography]" title="Abandonment"><img src="photography.php_files/Abandonment_by_boozker.jpg" class="thumbs" alt=""></a></li> <li class="thumb_list"><a href="http://www.boozkerstweaks.trap17.com/oscargodson/artwork/personal/art/photography/Serenity.jpg" rel="lytebox[photography]" title="Serenity"><img src="photography.php_files/Serenity_by_boozker.jpg" class="thumbs" alt=""></a></li> <li class="thumb_list"><a href="http://www.boozkerstweaks.trap17.com/oscargodson/artwork/personal/art/photography/Blissful.jpg" rel="lytebox[photography]" title="Blissful"><img src="photography.php_files/Blissful_by_boozker.jpg" class="thumbs" alt=""></a></li> <li class="thumb_list"><a href="http://www.boozkerstweaks.trap17.com/oscargodson/artwork/personal/art/photography/Cavort.jpg" rel="lytebox[photography]" title="Cavort"><img src="photography.php_files/Cavort_by_boozker.jpg" class="thumbs" alt=""></a></li> <li class="thumb_list"><a href="http://www.boozkerstweaks.trap17.com/oscargodson/artwork/personal/art/photography/Hope.jpg" rel="lytebox[photography]" title="Hope"><img src="photography.php_files/Hope_by_boozker.jpg" class="thumbs" alt=""></a></li> <li class="thumb_list"><a href="http://www.boozkerstweaks.trap17.com/oscargodson/artwork/personal/art/photography/Needless.jpg" rel="lytebox[photography]" title="Needless"><img src="photography.php_files/Needless_by_boozker.jpg" class="thumbs" alt=""></a></li> <li class="thumb_list"><a href="http://www.boozkerstweaks.trap17.com/oscargodson/artwork/personal/art/photography/Wearisome.jpg" rel="lytebox[photography]" title="Wearisome"><img src="photography.php_files/Wearisome_by_boozker.jpg" class="thumbs" alt=""></a></li> <li class="thumb_list"><a href="http://www.boozkerstweaks.trap17.com/oscargodson/artwork/personal/art/photography/Wounded.jpg" rel="lytebox[photography]" title="Wounded"><img src="photography.php_files/Wounded_by_boozker.jpg" class="thumbs" alt=""></a></li> <li class="thumb_list"><a href="http://www.boozkerstweaks.trap17.com/oscargodson/artwork/personal/art/photography/Escape.jpg" rel="lytebox[photography]" title="Escape"><img src="photography.php_files/Escape_by_boozker.jpg" class="thumbs" alt=""></a></li> </ul> A UL is a block-level entity, so remove the div from around it, since it isn't required. Change the class of the UL to do what the outer div was doing and It should be good. See above codebox, particularly the UL tag with the class change. I am thinking that the UL is not included inside the 'content' because the UL is 'floated', so the wrapper div ignores it. That is one problem with floats. They are removed from the normal document flow and then positioned afterwards, so they sometimes fall out of their container. *edit* And modify the CSS for the UL class once the changes are made.
Reply
BooZker
Aug 6 2007, 08:56 PM
Oh sorry I didnt even see the CSS part you wrote down for some reason. It was like it wasnt there. Anyways yah it works!!! Thanks so much. What does inline do?
Reply
truefusion
Aug 6 2007, 09:01 PM
QUOTE(jlhaslip @ Aug 6 2007, 04:53 PM)  A UL is a block-level entity, so remove the div from around it, since it isn't required. Change the class of the UL to do what the outer div was doing and It should be good. Removing the division won't work, 'cause the problem is being caused by the floating to the left.. Removing the division will just remove the yellowbox, but the images will still break through.
@Boozker: Inline just puts everything on one line; to put it shortly. It makes block-level elements not stretch from side to side. TABLEs, DIVs, ULs and similar are block-level elements. A, SPAN and others are inline-level elements.
Reply
jlhaslip
Aug 6 2007, 09:25 PM
check out the page structure at the Hoverbox Demo http://host.sonspring.com/hoverbox/Your site doesn't need the on-hover because you are doing the lightbox javascript method, but review the html and css for the Image UL to see how it works. One UL is all that is required here. Add some margin or padding to adjust them for spacing.
Reply
Recent Queries:--
css "images break out" - 708.10 hr back.
-
lytebox container padding - 858.34 hr back.
-
adjusting padding of lytebox container - 858.81 hr back.
-
lytebox container border page - 1137.25 hr back.
Similar Topics
Keywords : images, breaking, gallery, images, break, div
- How To Add Images
(9)
Feedback On Webdesign ( Political Art Video Gallery )
(4) Hello everyone, After a few months of work my new sitedesign is up. The page is mostly just a
showcase for some Political Art I've been doing. I'm pretty excited about my new
design. Although it isn't as "professional" as some of the other work i've done in the
past, I wanted something more personal and artistic. Any feedback/criticism/comments you have would
be much appreciated. -- Paolo Unger Dvorchik P.S. The artwork itself is still being updated, so
don't worry about discussing that quite yet (unless you can't hold yourself back ;....
Break Up's Are Hard.....
loosing a love (0) i broke up with my partenre 4wks ago as i had been with him for 3yrs.. i feel really crazy... the
relationshp had statrd to stumble on the birth of his daughter whih i knew was on the way when we
got together but it never really hit me until the actually day 13th of feb the day before valentines
and he cancelled our date...... as selfish as it may seem i was vey jealous and hurt given he was a
married man and a little joy which i may have received by seeing him would be scrambled completey
every year because of his daughter.... my selflishness made meparanoid and s....
Wis's Graphics
Warning, lots of images! (0) Here are some of my recent graphics, and oldies! Most of these are
vectored or have had some kind of vector influence. /smile.gif" style="vertical-align:middle"
emoid=":)" border="0" alt="smile.gif" /> As you can tell I like bright, vibrant colors. Also, I
don't use any brushes. Ever. /tongue.gif" style="vertical-align:middle" emoid=":P" border="0"
alt="tongue.gif" />....
Coppermine Photo Gallery [resolved]
(1) haha i finally got the time to make one.. ok so i have it installed.. & everything.. but im trying
to change the theme.. right now im looking at : CONFI: themes settings: have everything i wanted..
but i want to have an image at the top of the gallery. like have it be the first thing people see..
i know its posible ive seen people have it Path to custom header include: does anyone know what
i would have to put there? do i put the image url there? the code or what? this is the image i want
to put it: http://www.have-heart.net/chantelle/cpa.png or does it work l....
How To Display Images Of A Directory
(1) I am trying to do a simple thing. I want to display all the images of a directory on a single page
with the checkbox next to each image, so that i can select multi images and i can delete selected
images. Following few lines of code display the images of a directory.. i need help to put the
check boxes with each image. and I dont understand how can i select multi images with check box and
then delete them. I hope someone can help. thanks. CODE <?php $path = "./";
$dir_handle = @opendir($path) or die("Unable to open folde....
Skystormkuja' Gallery
(0) Well, I'm currently practicing, and hopefully improving my colouring skills. So even though my
drawing kinda sucks, I can at least color methinks. Excuse the Naruto theme. I'm into that now.
^_~ http://skystormkuja.deviantart.com/art/Min...e-Leaf-77842319
http://skystormkuja.deviantart.com/art/Ita...e-Leaf-77834588 ....
Go.. Take A Break - Stretch
(4) Stretching is very important. Stretching after a long days work or even stretching as part of your
exercise.. if that is your daily routine that is well and good. Stretching helps your body and your
muscles in particular to be in place and relieves stress and pain due to long term postures which
our day to day jobs and activities demands and push our health to danger. Stretching is good... but
there are also many worse things that could happen to you if you do not do it properly or in the
right manner or without some support from a professional trainer.. Its not always ....
Gallery Fixed.
(3) The Gallery in the forums did not have enough permissions. I have reset them and you should now be
able to post images to gallery. Let me know if there are any issues.....
Imagefilez.com Now Hosts - More Than 1 Million Images - Lots More To Come
(5) Hi Guys, I am really proud & happy at the same time to announce to you all that Imageflez is now
hosting more than 100,000 images. We really had a tough time recently cleaning spam on the server,
then came the big server upgrade, then bot attacks.. it was really tough times, But finally we are
now as strong as we were ever before. So spread the word and use Imagefilez & now let's grow.
/tongue.gif" style="vertical-align:middle" emoid=":P" border="0" alt="tongue.gif" /> Admin -
Imagefilez.com....
Browser Wars Episode 2007: Break Down Of Broswer Usage
(0) Now that 2007 is almost over with news of Netscape's demise in just two months, and the major
players in the browser wars are set in stong; Microsoft's Internet Explorer 6 & 7, Firefox 1.x.x
& 2.x.x and Beta 2 version of Firefox 3, Opera 9.x, and Safari 3.x. Lets just see where the % point
are for the major players. Growth Chart So as you can tell both browsers IE7 and FF2 started
roughly the same, 24% for IE7 and 25% for Firefox 2, but interestingly enough they ended the year
roughly the same but with firefox winning by 1% at 37% while IE takes a nice 36....
Uploading Images To Phpbb Galleries
(0) This tutorial can be used to show someone how to upload images to a PHPBB Gallerie addon. This
tutorial is not specific to any particular phpbb mod since all mods will most likely be similar. 1)
go to the website galleries (easy) (http://www.school-stuff.org/album.php) 2) Click on the category
that you want to upload the images to. 3) Look for a button that says Upload and click on it. 4)
Insert a Title in the title box this will be what people can identify the picture by, does not need
a description. 5) Click on the Browse Button next to 'Upload a picture from ....
Please Do Not Upload Adult Images - Accounts Will Be Banned
Imagefilez TOS re-visited (5) Hi Guys, Starting on with Good news first. We have moved Imagefilez.com on a new & more faster
dedicated server and the site is now loading really fast, so you guys can upload all your images
/smile.gif" style="vertical-align:middle" emoid=":)" border="0" alt="smile.gif" /> Now some serious
stuff is that we were spammed some days back, with the upload of adult images in huge numbers from
some Japanese/Chinese IP's, we have deleted all the images & also banned these IP's. I
request you all not to upload pornographic images or we will be forced to delete you....
Phpbb3 New Install
some scripts and images not working (9) Hello i installed phpbb3 on my qupis account and had no problem with it. But now i realized that it
is not showing the images or avatars of the forum. well please help me. site address :
http://infoinn.qupis.com ....
Php And Flash Image Gallery
Need some help in creating or editing an xml file while viewing some o (5) Hello there and thanks for the helping hand you are offering. PHP newbie here! /ph34r.gif"
style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" /> So here is my problem:
On my website I have a flash image gallery.The way the gallery works is by uploading pictures in a
folder and editing? an xml file.(pics.xml) where it adds the following code when you upload a
picture: CODE <pictures> <image location="nameofpicture1.jpg"
desc="" /> <image location="nameofpicture2.jpg" desc="" /&#....
Break Up Depression Need Help...
(5) Hi to whoever reading this . My girl just left me and i lost my job , i guess i neglect her and she
just left me after she got a new job with new colleagues . she treats me like a friend overnight , i
cant accept it , its hard . we been together for 2yrs and been thru alot . I been trying whatever i
could , but the more i tried the further she avoids me . Now she totally dont answer my calls . Its
been a week and i cant stop thinking of her , i tried to do other stuffs to forget but no matter
what i do she keeps coming to my mind . I cried everynight , i can't sleep....
I Got My Self A Domain And A Hosting Of 3 Tb
without money and breaking a sweat (15) well at last i have found where can i get my self a domain and a hosting within 1 day first go to
this site Here then register ur self and complete two or three offers and accumulate 1 point
(which is really easy no buying selling no credit card required at all) then refer 10 friends and u
have it 100$ dollar in ur paypal and then register urself at any hosting site P.S. if u cannot
refer friends then u have one more option now in this new age of technology everyone must have a pc
and an internet connection go to ur neighbours house or cousins house or a cyber c....
Install My Gallery
(5) who can install me a commpermine gallery?....
How Safe Are Condoms?
Even if they break? (24) Apparantly, a small percentage (Somewhere between 5 and 2%) of condoms break...now I don't know
if this is true, or how much it is on a scale of how many condoms are used /tongue.gif"
style="vertical-align:middle" emoid=":P" border="0" alt="tongue.gif" /> But condoms also have
spermicides in that are meant to kill sperm, so if it splits, how safe is it? (Don't worry,
I've not gone and split one and just making sure I'm ok...well, that I know of /tongue.gif"
style="vertical-align:middle" emoid=":P" border="0" alt="tongue.gif" />!)....
How To Make Gif Images?
(15) Which program i need to make GIF images?? Is that just Paint or something easyer, or i need download
some programs for making GIF images? I just see complete GIF images and then i download them, but
how can i make my own gif picture with 24 or more Frames? Does anyone know that? Please help mi
with that.......
Mars Probes Snap Stunning Images Of Giant Crater
(11) hey! i´ve come across with this interest piece of information
http://www.newscientistspace.com/article/d...ant-crater.html check check check check it out....
Scrolling Images?
How to Make an Image Scroll With the Page (4) I'm trying to make my homepage look a little fancier and I've got a nice background image,
but I want it to scroll with my page, like if you scroll down the image will still appear like it
does on the top of the page. Can someone tell me how to do this? I'm using Microsoft Frontpage
to edit it. I'm not sure what programming language this would be, probably CSS or Javascript,
but I can edit the page script with Notepad or something to make this work. Right now the page is
purely HTML, so whichever language this is, can somebody also give me the tags and ma....
Dealing With A Long Term Relationship Break Up
How do I deal with this? (20) I've been going out with this guy for about 2 years now, and for the past 1 or 2 months he was
acting a bit weird. A couple days ago he told me he didn't want to be in a relationship, he
wanted to be single, beacause he's been in serious relationships for a quite a while, so he just
wanted to have some time to himself. Well, with the help of a friend of mine and his, I found out
he's going out with this other girl, and he's been thinking about a serious relationship
with her for a while...and I don't know if he actually waited untill I was out of ....
Have You Ever Break Up With Someone
and realise it was a mistake? (14) I have a burning question, Has anyone dumped someone only to realize that it was a mistake. I ended
a relationship about six months ago, and after three months, I started to miss my ex-girlfriend. At
first i felt like she was the one who wanted to break up, so trying to protect myself, i did the
dumping. It wasn't so hard, cause i felt I came out unscathed...but after a few months, I
realized that i was wrong. I was not going through that guilt period that many went through in a
break up, I really I did some bad stuff pushing my ex-girlfriend away. We haven't tal....
Can You Add Images Into A Mysql Database?
Using Php? (20) I'm learning php in class right now, but I'm still not that good at it, what I'm
wondering is when I write the php so that it can connect with a database, can I at the same time
have it that it is able to display back images that I choose. Like, I want a search feature, where
you can search for a keyword, and it will bring back a list of all the possible entries with that
keyword, but each of these entries will have a photo associated with it. Now, do I put these image
files directly into the database, or do I write the code to link them from my files to th....
How To Double Stroke Images
Using Photoshop (22) (I am aware that there is an existing tutorial on double stroking text, but this is very different.)
How to double stroke images using Photoshop by Strawberrie 1. Open up/copy&paste the
image you want to double stroke onto a new layer (Shift+Ctrl+N) in Photoshop. 2. Go to Edit >
Stroke. Set the width to 3 px and color to whatever you wish your furtherest inside border to be (in
this case, black). You should get something like this: 3. Go to Edit > Stroke again. Set the
width to 2 px and color to whatever you wish your middle border to be (in thi....
Creating Links In Images
Using ImageReady (15) In this tutorial I will show you how to create links in your image. I'm shore there's a lot
of different ways you can do this, but I'll just show you how to do it real easy. 1) After
creating the image you want to add links to in photoshop, make shore the mode is set to RGB Color.
Just go to Image -> Mode -> RGB Color. 2) Go to File -> Jump To -> Adobe ImageReady. Your image
will now load into ImageReady. For this tutorial I will be using this image that I found: I will
make the buttons of this navigation bar into links. 3) Press K to select the slice t....
Turning An Image Into A Cartoon Style - Photoshop
Tutorial on cartooning images. (27) This tut will show you how to make a photo look cartoonish in three easy steps... 1)Open your
image in photoshop, doesnt really mater what size or shape anything really a landscape, city, or a
person. I am using a picture of a football player in this example 2)Go up to
Filter>Blur>Gaussian Blur and set the radius at 3.0 or higher depending on the effect your looking
for. 3)Last go Edit>Fade Gaussian Blur. A window will pop up... set the mode to darken for tha
cartoonish effect or to any other mode for plenty of other effects. Lower the opacity if you
don't....
Exporting Transparent Images In Photoshop To Flash
Needed: Photoshop 7 or CS, Flash MX (3) First of all, it is important that you make sure the image you wish to export is on a transparent
layer. The transparent layer is a checkered background in photoshop. You can see this checkered
background in the image to the left. In this example, I created a quick glass icon which has
different levels of transparency. This is the image I will be exporting, whilst preserving
it's transparency. Once your image is on a transparent background, head to file > save for
web. You can only export complex transparency using the .png filetype. So from the drop down....
1000 Free Psd Icon Images
They are very cool (10) Here it is: CODE http://www.stud.uni-hannover.de/~ngthanh/1000_ico/page_01.htm
http://www.stud.uni-hannover.de/~ngthanh/1000_ico/page_02.htm
http://www.stud.uni-hannover.de/~ngthanh/1000_ico/page_03.htm
http://www.stud.uni-hannover.de/~ngthanh/1000_ico/page_04.htm
http://www.stud.uni-hannover.de/~ngthanh/1000_ico/page_05.htm Carpe diem.....
Looking for images, breaking, gallery, images, break, div
|
|
Searching Video's for images, breaking, gallery, images, break, div
|
advertisement
|
|
