• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

DIV shrinks to fit its content

 
Ranch Hand
Posts: 33
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
In my JSP I have two DIV, one to display the content and other for footer which will have the buttons. Problem I am facing is, When i shrink my browser both DIV content also shrinks and it looks ugly. Can some one please tell me how i can stop DIV to shrink when anyone shrink the browser height or width. Hope I am making sense to every one.
 
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
What does this have to do with JSP?

Moved to the HTML/JavaScript forum.
 
author
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Give it a fixed width or live with having a fluid layout.

Eric
 
accnit Jai
Ranch Hand
Posts: 33
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I have given the width:auto now I tried to give fixed width, but no luck.
 
Eric Pascarello
author
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
The code would be....

Eric
 
accnit Jai
Ranch Hand
Posts: 33
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
here is the css code
body,html {
font-family: "Trebuchet MS", Georgia, Verdana, serif;
text-align: center;
margin: 0;
}

#content {
background-color: gray;
bottom: 80px;
overflow: auto;
position: absolute;
top: 0px;
width: 100%;
}

#footerwrap {
position: fixed;
bottom: 0px;
height: 80px;
background-image: url('../images/footer_background.png');
background-repeat: repeat-x;
float: right;
width: 100%;
overflow: auto;
}

#popup {
width: 67px;
height: 60px;
background-image: url('../images/docNavImg.png');
background-repeat: no-repeat;
bottom: 10px;
left: 0px;
margin-top: 10px;
position: absolute;
cursor: pointer;
}

#zoom {
position: absolute;
width: 67px;
height: 60px;
margin-left: 80px;
background-image: url('../images/device_nav_button_zoom.png');
background-repeat: no-repeat;
bottom: 10px;
margin-top: 10px;
position: absolute;
cursor: pointer;
}

.previouspage {
margin-top: 10px;
margin-left: 160px;
background-image: url('../images/button_prev_page.png');
height: 60px;
width: 105px;
background-repeat: no-repeat;
bottom: 10px;
position: absolute;
cursor: pointer;
}

.nextpage {
width: 105px;
height: 60px;
background-image: url('../images/button_next_page.png');
background-repeat: no-repeat;
bottom: 10px;
margin-top: 10px;
position: absolute;
right: 0px;
cursor: pointer;
}

Here is my JSP code:

<div id="content" align="center" >
<img src="../images/doc_4.png" width="60%" id="docs" align="middle" />
</div>

<!--Footer Start-->
<div id="footerwrap">

<div id="popup" ></div>
<div id="zoom" ></div>
<div class="previouspage"></div>
<div class="nextpage" id="next"></div>

</div>

 
Ranch Hand
Posts: 47
MySQL Database PHP Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Try using the min-width style on the DIV.
 
Eliminate 95% of the weeds in your lawn by mowing 3 inches or higher. Then plant tiny ads:
a bit of art, as a gift, that will fit in a stocking
https://gardener-gift.com
reply
    Bookmark Topic Watch Topic
  • New Topic