...

View Full Version : how do stop images from moving when shrinking browser



rusty813
07-22-2011, 05:13 AM
so i have some image links and when i close the browser they tend to move closer to one another so all the links still fit the in the browser. what can i add to the css to make the links from overlapping when shrinking the browser size

teedoff
07-22-2011, 05:29 AM
Hard to tell whats going on without seeing the site or code.

alykins
07-22-2011, 06:46 AM
shot in the dark... remove the width:%'s and make them width: px's

rusty813
07-22-2011, 09:44 AM
I tried about everything possible and everytime i shrink my browser the images and links overlap instead of overflow-x appear, i tried adding overflow to it, and it just stays greyed out

heres my coding


.logo {
background-image: url(../images/logo/logo.png);
background-repeat: no-repeat;
width: 613px;
height: 205px;
}

.nav {
float: right;
}

.nav a{
text-decoration: none;
}

.nav ul {
word-spacing: -2px;
border-bottom: 4px solid pink;
}

.nav ul li {
display: inline;
}

effpeetee
07-22-2011, 09:53 AM
Find some guidance here (http://www.ibm.com/developerworks/web/library/wa-rapid/)

and more here, (http://www.exitfegs.co.uk/Sources.html)
Frank

vikram1vicky
07-22-2011, 09:54 AM
Set fixed width to parent div of images....

:)

rusty813
07-23-2011, 12:49 AM
heres an updated version of my work its not overlaping anymore and scroll bar is showing, but the scrollbar still appears no matter if the browser is full-size or small, and I can move the scrollbar all the way to right cause the page to shift to the left, how can i fix up the scrolling issue now...thanks



#header {
width: 100%;
height: 120px;
}

.logo {
position: relative;
background-image: url(../images/logo/logo.png);
background-repeat: no-repeat;
width: 613px;
height: 205px;
z-index: 999;
}

.nav {
position: relative;
top: -166px;
left: 670px;
}

.nav a{
text-decoration: none;
}

.nav ul {
word-spacing: -2px;
}

.nav ul li {
display: inline;
}

.border-btm {
border-bottom: 4px solid pink;
position: fixed;
top: 106px;
left: 190px;
width: 1166px;
}

a#home img, a#aboutme img, a#gallery img, a#videos img, a#livecam img, a#signup img {
border-style: none;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum