CSS Box Problem

Hi,
My site have a some problem in css box. Screen shot is attached for reference.
Please help for the same.
Weblink

Have some performance issues on Windows XP, too.
I am using d3d prism settings to render on Windows 7 and XP. On Windows 7 everything working fine.
On Windows XP it is slow and sometimes flickering.
I didn't find a solution.
1) Tried to start the application with other prism settings like -Dprism.order=d2d and OpenGL.
2) I changed the 3d graphic settings that made it better, but didn't solve the issue.
Someone knows the difference of rendering the javafx application in Windows 7 and XP (DirectX 11, DirectX9.0c)?

Similar Messages

Override Link Class in "Other CSS" Box

Hi -is there a way to override the class of a link in the "other styles" box for a component?
My example is this:
I use a skin with a dark header. The text for the widgets in the header are white (Administration, etc)
The body of the site is white.
When I put another widget that uses the same class (x106 in this case) it makes the link color white and you can't see it on the page.
I've tried many ways to go into the "other CSS" box (under the style tab) and none seem to work.
Thanks.

Hi - thanks.
That's not exactly the problem. I know what the classes are (x106 and x107).
The problem is that I am trying to use two "widgets" or ADF components (like the login/logout or My Favorites links) on two different background colors.
I cannot get into the code of the ADF component to tell it to use a different class.
Also, if I change the class (x106 for example) it changes ALL of them.
What I think I need is a way to override the CSS for the link in the "Other CSS" box for that component somehow (I've tried many things - can't figure it out and not sure it can be done). I would think that this would override the class in the skin.
In short - what I'm asking, I guess, is this.
IS there a way to override the CSS LINK color for an ADF template component - OTHER THAN in the Skin's CSS file.
Thanks!

Spry Vertical Submenu - Expanding Box Problem, white background

Hello everyone. I've recently incorporated a Spry Vertical Menu on my site for the first time and I'm experiencing problems with the submenu in IE7. (Things look fine in FF, Safari, and Opera.) A white box appears behind the text area (the "bios" and "contact us" links). And....In IE6 the entire menu bar becomes a horizontal mess.
I've come to learn that this is called an Expanding Box Problem but I don't know how to fix it. Perhaps this is seperate issue from the white panel issue altogether. I dunno. Can anyone be of assistance? I've been trying to solve this problem for days.
http://www.exposedproductionsnyc.com
Below is the CSS:
/* The outermost container of the Menu Bar, a fixed width box with no margin or padding */
ul.MenuBarVertical
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: 8em;
    padding-top: 0px;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 31.5px;
    background-color: #000;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 0;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
    z-index: 1000;
/* Menu item containers, position children relative to this container and are same fixed width as parent */
ul.MenuBarVertical li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 160px;
    background-color: #000;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarVertical ul
    margin: -5% 0 0 95%;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: absolute;
    z-index: 1020;
    cursor: default;
    width: 8.2em;
    left: -1000em;
    top: 0;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarVertical ul.MenuBarSubmenuVisible
    left: 0;
/* Menu item containers are same fixed width as parent */
ul.MenuBarVertical ul li
    width: 100px;
    padding-left: 29px;
    padding-top: 3px;
    margin-top: 1px;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Outermost menu container has borders on all sides */
ul.MenuBarVertical
/* Submenu containers have borders on all sides */
/*ul.MenuBarVertical ul
    border: 1px none #CCC;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarVertical a
    display: block;
    cursor: pointer;
    background-color: #000;
    padding: 0.5em 0em;
    color: #FFF;
    text-decoration: none;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
    background-color: #000;
    color: #6CC3D7;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
    background-color: #000;
    color: #6CC3D7;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    background-color: transparent;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    background-color: transparent;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarVertical iframe
    position: absolute;
    z-index: 1010;
    filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
    ul.MenuBarVertical li.MenuBarItemIE
    display: inline;
    f\loat: left;

Long answer = z-index
http://www.smashingmagazine.com/2009/09/15/the-z-index-css-property-a-comprehensive-look/
Nancy O.

Expanding box problem in some browsers

My bottom three dividers are having an expanding box problem in some browers. Any idea how to fix? This is my first website and I am clueless.....
www.privateinsurancebrokers.com
Source Code:
V <div id="container">
    <div id="main_image"><img src="Images/ThreeArch.jpg" width="960" height="400" alt="Kenneth G. Harris Insurance Agency" /></div>
    <div id="left_colum">
        <strong><a href="employeebenefits.html"><img src="Images/Website_EmployeeBenefits.jpg" width="310" height="127" alt="Employee Benefits Orange County" /></a>Employee Benefits
      </strong><br />
      Since 1972, Kenneth G. Harris Insurance Agency has advocated for our clients in the process of securing the highest value employee benefit program. <a href="employeebenefits.html" target="_new">Learn More»</a> </div>
    <div id="center_column"><strong><a href="HealthInsurance.html"><img src="Images/Family and Individual Insurance.jpg" alt="Family and Individual Insurance Services" width="310" height="127" align="top" /></a>Individual & Family Insurance Services
    </strong>Kenneth G. Harris Insurance Agency will work with our insurance and financial partners to assist you with all aspects of your personal insurance needs. <a href="individualinsurance.html" target="_new">Learn More»</a></div>
    <div id="right_column"><a href="news.html"><img src="Images/blog.jpg" width="310" height="127" alt="Health and Life Insurance News Orange County" /></a>
      <strong>Information</strong> <br />
Keep up-to-date with the latest employee benefits and private insurance news. Let us serve as your resource for health care reform news and<a href="article2.html" title="Kenneth G. Harris Insurance Agency Group Health and Individual Insurance" target="_new"> more»</a></div>
</div>

Your CSS Layout has a provision for clearing floats but I don't see it in your HTML markup.
Insert a float clearing <br> <p> or <hr> right above your footer division like so:
<hr class="clearfloat" />
<div class="footer">
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

CSS Float Problem

Hi All, 10 years since I've been on here (in the days of tables) I have, I'm sure a very basic css float problem in the footer and hopefully someone could take the time to review it for me. I have checked everything but can't find the problem. Thanks in advance;
example of problem here http://davidbrown.ipower.com/template/template.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Our Jewelry Retail Secrets - Thank You</title>
<link href="../stylesheet/style.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>
</head>
<body>
<div id="wrapper">
<div id="wrapperfix">
    <div id="toporange_bg">login</div>
</div>
   <div id="wrapperfix_top_grey">
    <div id="top_grey_content_wrapper">
      <div id="big_logo"></div>
      <div id="welcome_user">Welcome "username here"</div>
    </div>
</div>
</div>
    <div id="main_content">
      <p>
        
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam vel felis velit. Proin a nisl diam, id hendrerit lectus. Nunc eget tortor arcu. Mauris fringilla felis eget mi facilisis vel auctor est lacinia. Sed sit amet dui nibh, in varius metus. Duis malesuada euismod tortor eget lacinia. Donec pretium rutrum nunc, sagittis condimentum elit aliquam in. In eu mauris dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
      <p> Nam vel felis velit. Proin a nisl diam, id hendrerit lectus. Nunc eget tortor arcu. Mauris fringilla felis eget mi facilisis vel auctor est lacinia. Sed sit amet dui nibh, in varius metus. Duis malesuada euismod tortor eget lacinia. Donec pretium rutrum nunc, sagittis condimentum elit aliquam in. In eu mauris dui. </p>
</div>
    <div id="footer_container">
      <div id="footer">
        <div id="footer_left">Footer Left</div>
        <div id="footer_centre">Footer Centre</div>
      <div id="footer_right">Footer Right</div></div>
    </div>
</body>
</html>
#footer_container {
background-color: #333333;
width: 100%;
top: 0px;
margin: 0px;
padding: 0px;
#footer {
background-color: #666666;
min-width: 1000px;
margin-right: auto;
margin-left: auto;
padding: 0px;
width: 1000px;
height: 150px;
overflow: hidden;
clear: both;
margin-top: 0px;
margin-bottom: 0px;
position: relative;
#footer_left {
float: left;
width: 33%;
margin: 0px;
padding: 0px;
height: 150px;
#footer_centre {
width: 33%;
height: 150px;
margin: 0px;
padding: 0px;
float: left;
#footer_right {
float: left;
width: 33%;
height: 150px;
margin: 0px;
padding: 0px;

I still don't see the #footer_left rule in the CSS in the online example at
http://davidbrown.ipower.com/template/template.htm

"Dialog box "PROBLEM WITH SHORTCUT"

When my T40 p starts up I keep getting the following message, over and over again until I close the system tray IBM Connect bar.
"Dialog box “PROBLEM WITH SHORTCUT”
The drive or network connection that the shortcut IBM Access Support.lnk refers to is unavailable. Make sure that the disc is properly inserted to the network resource is available, and then try again. "
Help!

You'll need to find your iTunes folder. It's usually located on your main hard disk under My Documents/My Music/iTunes. Copy this whole folder to another hard drive (if possible) or burn it on a CD (probably will take more than one--depending upon how large your library is) or DVD. Once you have a good backup of your library, try downloading and reinstalling iTunes.

Activity Box problem

I am working on an Activity Box problem. I got some errors, Please Help and Thanks in advance!!!
My program likes:
import java.awt.*;
import java.applet.*;
import java.awt.event.*;
/*ActivityBox Applet */
    public class ActivityBox extends Applet {
//Declarations
    String panelString = new String("News from the field.");
    String southString = new String("South Button");
    String infoString = new String("Type here.");
    String kbString = new String("East ");
    MousePanel cp = new MousePanel(100,100,panelString);
    MousePanel ep = new MousePanel(100,100, kbString);
    MousePanel np = new MousePanel(50,50);
    MousePanel sp = new MousePanel(100,100);
    MousePanel wp = new MousePanel(100,100,"West - Type here");
    TextField myText = new TextField(infoString);
    Button southButton = new colorChanger(southString);
    colorChanger Blues = new colorChanger(Color.blue);
    buttonListener Zap = new buttonListener(cp, myText, ep);
    kbListener Tap = new kbListener(ep, kbString);
//init
    public void init() {
     setLayout(new BorderLayout(5,5));
         np.addMouseListener(Blues);
     add("North",np);
         np.add(myText);
     np.setBackground(Color.Cyan);
         sp.addMouseListener(Blues);
         southButton.addActionListener(Zap);
     sp.add(southButton);
     add("South", sp);
     sp.setBackground(Color.Cyan);
         ep.addMouseListener(Blues);
     add("East",ep);
     ep.setBackground(Color.Cyan);
         wp.addMouseListener(Blues);
         wp.addKeyListener(Tap);
        add("West",wp);
     wp.setBackground(Color.Cyan);
         cp.addMouseListener(Blues);
     add("Center",cp);
     cp.setBackground(Color.Cyan);
/* MousePanel */
class MousePanel extends Panel {
    public String nameTag = "";
    Dimension myDimension = new Dimension(15,15);
//Constructor 1 - no name tag
    MousePanel(int h, int w) {
     myDimension.height = h;
     myDimension.width = w;
//Constructor2 - with name tag
    MousePanel(int h, int w, String nt) {
     myDimension.height = h;
     myDimension.width = w;
     nameTag = nt;
//paint
    public void paint(Graphics g) {
     g.drawString(nameTag,5,10);
//change text
    public void changeText(String s){
     nameTag = s;
     repaint();
    public Dimension getPreferredSize(){
     retrun myDimension;
//getMinimumSize
    public Dimension getMinimumSize(){
     return myDimension;
class colorChanger implements MouseListener {
    private Color oldColor = new Color(0,0,0);
    private Color changeColor = new Color(0,0,0);
    //constructor
    colorChanger(Color it){
     changeColor = it;
    //Methods required to implement MouseListener interface
    public void mouseEntered(MouseEvent e) {
     oldColor = e.getComponent().getBackground();
     e.getComponent().requestFocus();
    public void mouseExited(MouseEvent e) {
     e.getComponent().setBackground(oldColor);
     e.getComponent().transferFocus();
    public void mousePressed(MouseEvent e) {
    public void mouseReleased(MouseEvent e) {
    public void mouseClicked(MouseEvent e) {
class buttonListener implements ActionListener {
    private MousePanel it1 = new MousePanel(0,0,"");
    private MousePanel it2 = new MousePanel(0,0,"");
    private TextField from = new TextField("");
    private String words = new String("");
    //constructor
    buttonListener(MousePanel target1, TextField source, MousePanel target2){
     it1 = target1;
     from = source;
     it2 = target2;
    //Methods required to implement ActionLIstener interface
    public void actionPerformed(ActionEvent e) {
     words = from.getText();
     it1.changeText(words);
     from.setText("");
     it2.changeText("");
}//end buttonListener
class kbListener implements KeyListener {
    private MousePanel it = new MousePanel(0,0,"");
    private String putString = new String("");
    //constructor
    kbListener(MousePanel target, String display){
        it = target;
     putString = display;
    //Methods required to implement KeyListener interface
    public void keyPressed(KeyEvent e) {
    public void keyReleased(KeyEvent e){
    public void keyTyped(KeyEvent e){
     putString = putString + e.getKeyChar();
     it.changeText(putString);
}When I compiled it, I got:
ActivityBox.java:18: cannot resolve symbol
symbol : constructor colorChanger (java.lang.String)
location: class colorChanger
    Button southButton = new colorChanger(southString);
                         ^
ActivityBox.java:24: cannot resolve symbol
symbol : constructor BorderLayout (int,int)
location: class BorderLayout
        setLayout(new BorderLayout(5,5));
                  ^
ActivityBox.java:28: cannot resolve symbol
symbol : variable Cyan
location: class java.awt.Color
        np.setBackground(Color.Cyan);
                              ^
ActivityBox.java:33: cannot resolve symbol
symbol : variable Cyan
location: class java.awt.Color
        sp.setBackground(Color.Cyan);
                              ^
ActivityBox.java:36: cannot resolve symbol
symbol : variable Cyan
location: class java.awt.Color
        ep.setBackground(Color.Cyan);
                              ^
ActivityBox.java:40: cannot resolve symbol
symbol : variable Cyan
location: class java.awt.Color
        wp.setBackground(Color.Cyan);
                              ^
ActivityBox.java:43: cannot resolve symbol
symbol : variable Cyan
location: class java.awt.Color
        cp.setBackground(Color.Cyan);
                              ^
ActivityBox.java:72: cannot resolve symbol
symbol : class retrun
location: class MousePanel
        retrun myDimension;
        ^
.\BorderLayout.java:8: setLayout(java.awt.LayoutManager) in java.awt.Container c
annot be applied to (BorderLayout)
        p.setLayout(new BorderLayout ());
         ^
.\BorderLayout.java:9: cannot resolve symbol
symbol : variable NORTH
location: class BorderLayout
        p.add("North", BorderLayout.NORTH);
                                   ^
.\BorderLayout.java:10: cannot resolve symbol
symbol : variable SOUTH
location: class BorderLayout
        p.add("SOUTH", BorderLayout.SOUTH);
                                   ^
.\BorderLayout.java:11: cannot resolve symbol
symbol : variable EAST
location: class BorderLayout
        p.add("EAST", BorderLayout.EAST);
                                  ^
.\BorderLayout.java:12: cannot resolve symbol
symbol : variable WEST
location: class BorderLayout
        p.add("WEST", BorderLayout.WEST);
                                  ^
.\BorderLayout.java:13: cannot resolve symbol
symbol : variable CENTER
location: class BorderLayout
        p.add("CENTER", BorderLayout.CENTER);
                                    ^
14 errors

Again compile ur code .... I don't seem to get all those errors

Fail-box problem

Hi!
I have some problem and I need help..
fail-box problem with lokal and network system.
I dont know how to solve it'
Thank you...

Are you still facing the same issue ? if yes then please post the screenshot of exact error and few details such as if you are getting this error while opening a specific file or on double click on Muse itself ?
Thanks,
Sanjit

Expanding Box Problem

I have been working all morning to add a horizontal spry menu
bar to the menu_bar section of the Mother Earth Template (
http://www.webshapes.org/template/details/id/200702247034127204)
from Webshapes (
http://www.webshapes.org/)
Anyway, I had to do some crazy positioning to get the
submenus to lign up with the menus and now the submenus will not
display in IE because of an 'expanding box problem' All of the
problems are associated with either my "ul.MenuBarHorizontal ul" or
my "ul.MenuBarHorizontal ul ul"
Can anyone help me with this? I am a beginner with
Dreamweaver and have been having a lot of troubles with it.
Thanks.

Hello Tom, Is it a template related error message?
I would suggest you to use percentages when setting the width
and height values.

My CSS box doesn't seem to be pushing the text out of the way

Hi guys,
Have
a look here
I've just managed to get CSS boxes working on my site, and as
you'll see have applied them to the right hand side of a number of
pages and added links. I looked at the site locally and online last
night from my machine and everything seemed to be working as
expected.
However, I've just got to work and had a look at some of the
pages and the text box A - doesn't seem to have extended enough to
surround all of the linked text and B - doesn't seem to have pushed
the surrounding text out of the way enough so now there's a
horrible overlapping this going on.
As I have set the box's height properties to something like
150 (can't quite remem) I'm assuming this is what is causing A and
B? So, how do I then set the box's properties so that it will
shorten or lenghten depending on how much text I put inside it -
just leave the height property field blank?
Hope you can help guys!
Let me know if you need more info.
Cheers,
James

JamesFryer wrote:
So, how do I then set the
> box's properties so that it will shorten or lenghten
depending on how much text
> I put inside it - just leave the height property field
blank?
Yes. The answer is to never set the height of a box which
contains text
(unless its for a scrolling area). Let the amount of text
within the box
determine the height.

Adding a hyperlink to a css box

Hello !
I am trying to add a hyperlink to a css box so when clicked it redirects to a page: for example www.google.com
Also in the box i have an image.
This is the box:
CSS
#Box1 {float: left; background:url(butondesprenoi.jpg);background-size:contain; }
#Box1:hover {background:url(butondesprenoi2.jpg);background-size:contain; transform:rotate(7deg);
-ms-transform:rotate(7deg);
-webkit-transform:rotate(7deg); }
HTML
<div id="Box1">
<h2></h2>
So how can i do it ?

Valen90 wrote:
Hello !
I am trying to add a hyperlink to a css box so when clicked it redirects to a page: for example www.google.com
Also in the box i have an image.
So how can i do it ?
Add a hyperlink to a css box? not sure what exactly do you mean. However, you can add a hyperlink in your html code like this:
<div id="Box1">
<h2>Heading Level 2</h2>
<a href="http://google.com">
<img alt="image-inside-box" class="auto-style1" height="340" src="https://sc.imp.live.com/content/dam/imp/surfaces/mail_signin/v3/images/SISU_0003_SkypeMidEngaged_475x340.jpg" width="475"></a></div>
hope this is what you are after.

10.4.7 MLTE black box problem

Hi all
Anyone get a black MLTE box problem after the 10.4.7 upgrade?
The multilingual text engine in the open source game Aleph One after the upgrade to 10.4.7 - shows a black box in the chat area. It is not always a problem - about 30% of the games I start seem to have it.
Thanks

I just recieved an email from F-Secure, after I told them, that no attachments sent from Mail (after 10.4.7) go through to F-Secure / Windows users.
They have investigated the problem and reported this:
The attachments MIME header has the following fields: name and filename.
For some reason Mail removes the blank spaces from the name field but leaves the filename field untouched. These differences in the fields make F-Secure remove the attachment (alarm).
One "fix" is removing the blank spaces from the filename, for example File 1.pdf >> File1.pdf. But this in not easy computing. Everything works just fine with 10.4.6 and before, but 10.4.7 >> is causing the problems.
PowerMac Dual Core G5/2,3GHz | 250Gb | SD | 23 Cinema • PB G4/1,67GHz | 15,2 | 8 Mac OS X (10.4.7) AppleFarmer

Is this Cf or CSS causing problem?

I am on the home stretch on this job. I have this one irritating problem and I am not sure if the prob is being caused by a <cfinput> tag or a style sheet
problem. Maybe someone out there can help identify what's happening. My guess is that it is in the CSS, but pulling my hair out to find it.
You will have to go to this page: http://www.renobowls.com/leagues/leagueRegSelect.cfm and click on "Individual Reg" button.
Look at the radio buttons underneath "Step One: Individual Registration"
I cannot get these suckers to line up in a single line. Here is the code:
<div class="box2">
<table>
<tr>
<td width="100%">
    Are you a returning Reno Bowls league player?
</td>
<td width="50%">
<strong>NO</strong> <cfinput type="radio" class="fleft" name="priorRBLeague" value="No" checked="no">
</td>
<td>
    <strong>YES</strong><cfinput class="fleft" type="radio" name="priorRBLeague" value="Yes" checked="Yes">
</td>
</tr>
</table>
</div>
Here is the CSS:
/*box2*/
.box2{ background:#e8e8e7; width:100%;}
.box2 .indent-box-1{ padding:35px 0 0 0; }
Inherited CSS: (going backwards)
div.container { overflow:hidden; width: 100%}
then:
/*box*/
.box{ background:#fdfdfd; width:100%;}
.box .border-top {background:url(images/border_top.gif) repeat-x top;}
.box .border-bottom {background:url(images/border_bottom.gif) repeat-x bottom;}
.box .border-left {background:url(images/border_left.gif) repeat-y left;}
.box .border-right {background:url(images/border_right.gif) repeat-y right;}
.box .corner-top-left {background:url(images/corner_top_left.gif) no-repeat left top;}
.box .corner-top-right {background:url(images/corner_top_right.gif) no-repeat right top;}
.box .corner-bottom-left {background:url(images/corner_bottom_left.gif) no-repeat left bottom;}
.box .corner-bottom-right {background:url(images/corner_bottom_right.gif) no-repeat right bottom; width:100%; }
.box .indent-box{ padding:35px 35px 17px 35px; }
then:
/*T-Reg*/
#tReg { font-size:0.75em; width:100%; text-align:left;}
#tReg .indent-main{padding:0 67px 0 67px}
#tReg .title{ background:url(images/bg_title.gif) repeat-x top; text-align:center}
#tReg .title h2{ margin-bottom:5px}
#tReg .img-left{ float:left; margin:0 20px 16px 0}
#tReg .img-left1{ float:left; margin:0 20px 0 0}
#tReg .img-indent{ margin:0 0 16px 0}
#tReg .img-indent1{ margin:0 12px 6px 0}
#tReg p{ margin:0 0 17px 0}
#tReg .p{ margin:0}
#tReg .p1{ margin:0 0 17px 0; width:100%}
#tReg .p2{ margin:0 0 7px 0}
#tReg h4{color:#6d6d6d; font-size:1em; }
#tReg h5{color:#2a88d8; font-size:.916em; text-transform:uppercase; margin-bottom:5px }
#tReg h2{color:#3b3e40; font-size:1.66em; text-transform:uppercase; margin-bottom:15px; line-height:1.2em }
#tReg .h2{color:#0f2f55; font-size:1.66em; text-transform:uppercase; margin-bottom:5px }
#tReg .h2 span{color:#1e5597; text-transform:none; font-weight:normal}
#tReg .tail{ background:url(images/tail.gif) repeat-x bottom; padding-bottom:17px; margin-bottom:17px}
#tReg ul{margin:0; padding:0; list-style:none;}
#tReg ul li{background:url(images/marker.gif) center left no-repeat; background-position:1 1px; margin:0; padding-left:18px; }
#tReg ul li a{color:#6d6d6d; text-decoration:none ; line-height:2em; font-weight:bold}
#tReg ul li a:hover { text-decoration:underline; }
#tReg .indent{padding:28px 0 0 0}
#tReg .indent-1{padding:0 0 0 128px}
.txt1{ color:#6d6d6d; font-weight:bold}
.txt2{ color:#b72723; font-weight:bold}
finally:
body {font-size:100%; line-height:1em; background:url(images/bg.gif) repeat-x #03162a; position:relative;}

try this:
<div class="box2">
<table>
<tr>
<td width="100%">
    <table style="width:100%">
      <tr>
        <td><nobr>Are you a returning Reno Bowls league player?</nobr></td>
        <td><strong>NO</strong></td>
        <td><cfinput type="radio" class="fleft" name="priorRBLeague" value="No" checked="no"></td>
        <td><strong>YES</strong><cfinput class="fleft" type="radio" name="priorRBLeague" value="Yes" checked="Yes"></td>
     </tr>
    </table>
</td>
</tr>
</table>
</div>

Nested CSS boxes

Trying to get the hang of this CSS positioning thing...
Need to have a large centered box (main div) with several (2
to 4) small boxes within it. Essentially, the only text in the
first box (main div) is a H2.
I want the "big" box to have a height that will adjust to the
content of the smaller boxes within it. The small boxes will have
several to many lines of text or table data. The content will be
php-extracted from a mysql database, so it will vary in nbr of rows
returned.
Using DW MX 2004. I have the "main1" div, then used the DW
"Draw Layer" for a couple of the boxes. You'll see the in-line CSS
that was created with that... once I figure everything out I'll
move all CSS to the external sheet. Right now it's either in the
page head or in-line with the divs.
My problem is: the main div (Manage Content) is not adjusting
in height to be a background for the divs within it. I read several
suggestions about setting the properties of html and body to 100%
height (that's why it's in the CSS in the head). I thought that if
I postioned the main div as relative, then I can position the
nested divs as absolute off of the main? Doesn't seem to be the
right answer.
Test page:
Test page of
bad divs
Thanks in advance for helping!

You do NOT want to use Layers for this. Since absolutely
positioned page
elements are removed from the normal flow of the page, they
cannot cause
containers to expand. That's why using layers as a page
layout method is so
seriously flawed.
The term "CSS positioning" does not refer to just using
layers. It refers
to the use of CSS to place elements on the page with margins,
paddings,
floats, and occasionally, with positioning, but only
occasionally.
This may help you understand positioning a bit -
There are 4 different types of positioning:
Absolute
Relative
Fixed
Static
Here is a brief explanation of each kind of positioning (with
regard to
placement of elements on the page only)....
Position:absolute (or A/P elements)
This does several things -
1. It 'removes' the element from the flow of the code on
the page so that
it can no longer influence the size or position of any other
page element
(except for those contained within it, of course).
2. The absolutely positioned element takes its position from
the position of
its closest PARENT *positioned* element - in the
absence of any explicitly
positioned parent, this will default to the <body> tag,
which is always
positioned
at 0,0 in the browser viewport.
This means that it doesn't matter where in the HTML code the
layer's code
appears (between <body> and </body>), its
location on the screen will not
change (this assumes that you have not positioned the A/P
element within
a table or another A/P element, of course).
Furthermore, the space in
which
this element would have appeared were it not positioned
is not preserved
on the screen. In other words, absolutely positioned elements
don't take
up any space on the page. In fact, they FLOAT over the page.
Position:relative (or R/P elements)
In contrast to absolute positioning, a relatively positioned
page element is
*not* removed from the flow of the code on the page, so
it will use the
spot
where it would have appeared based on its position in
the code as its
zero point reference. If you then supply top, right,
bottom, or left
positions
to the style for this element, those values will be
used as offsets from
its
zero point.
This means that it DOES matter where in the code the
relatively positioned
element appears (, as it will be positioned in that location
(factoring in
the offsets) on the screen (this is true for any placement in
the code).
Furthermore, the space where this element would have
appeared is
preserved in the display, and can therefore affect the
placement of
succeeding elements. This means that the taller a relatively
positioned element is, the more space it forces on the page.
Position:static
As with relative position, static positions also "go with
the flow". An
element with a static position cannot have values for
offsets (top, right,
left, bottom) or if it has them, they will be ignored. Unless
explicitly
positioned, all div elements default to static positioning.
Position:fixed
A page element with this style will not scroll as the page
content scrolls.
Support for this in elements other than page backgrounds is
quirky
There are several other things you need to know:
1. ANY page element can be positioned - paragraphs, tables,
images, lists,
etc.
2. The <div> tag is a BLOCK level tag. This means that
if it is not
positioned or explicitly styled otherwise, a) it will always
begin on a new
line on the screen, and b) it will always force content to a
new line below
it, and c) it will always take up the entire width of its
container (i.e.,
width:100%).
3. The placement of A/P elements *can* affect the BEHAVIOR of
other
elements
on the page. For example, a 'layer' placed over a hyperlink
will mask that
hyperlink.
You can see a good example of the essential difference
between absolute and
relative positioning here -
http://www.great-web-sights.com/g_layersdemo.asp
You can see a good demonstration of why using layers for a
page layout tool
is dangerous here -
http://www.great-web-sights.com/g_layer-overlap.asp
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"JillTW" <[email protected]> wrote in
message
news:[email protected]...
> Trying to get the hang of this CSS positioning thing...
>
> Need to have a large centered box (main div) with
several (2 to 4) small
> boxes
> within it. Essentially, the only text in the first box
(main div) is a H2.
>
> I want the "big" box to have a height that will adjust
to the content of
> the
> smaller boxes within it. The small boxes will have
several to many lines
> of
> text or table data. The content will be php-extracted
from a mysql
> database, so
> it will vary in nbr of rows returned.
>
> Using DW MX 2004. I have the "main1" div, then used the
DW "Draw Layer"
> for a
> couple of the boxes. You'll see the in-line CSS that was
created with
> that...
> once I figure everything out I'll move all CSS to the
external sheet.
> Right now
> it's either in the page head or in-line with the divs.
>
> My problem is: the main div (Manage Content) is not
adjusting in height to
> be
> a background for the divs within it. I read several
suggestions about
> setting
> the properties of html and body to 100% height (that's
why it's in the CSS
> in
> the head). I thought that if I postioned the main div as
relative, then I
> can
> position the nested divs as absolute off of the main?
Doesn't seem to be
> the
> right answer.
>
> Test page:
>
>
http://www.susanchambersdance.com/cms/test_div.php
>
> Thanks in advance for helping!
>

DW/CSS Table problem

Hi guys:
I have been working with CSS in DW for a while now but it
always makes me mad when I cant Firefox and IE to look the page
same. I guess its a problem with setting the width of the table. I
have done it but somewhere I am missing the obvious . It works fine
in FF but messes up in IE (Grrrrr). Please help! Here what I have
been working on :
quote:
<html><head><title>MNTP</title>
<style>

</style>
<script type="text/javascript" type="text/javascript"
src="cssquery2-p.js"></script>
<script type="text/javascript" type="text/javascript"
src="ruzeeborders.js"></script>
<script type="text/javascript"
type="text/javascript">
</script>
<script src="Scripts/AC_RunActiveContent.js"
type="text/javascript"></script>
</head>
<body>
<table width="720" border="0" align="center"
cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top"><script
type="text/javascript">
AC_FL_RunContent( 'codebase','
http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','wid th','720','height','275','align','absmiddle','src','mntp_top_1','q
uality','high','pluginspage','
http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movi e','mntp_top_1'
); //end AC code
</script><noscript><object
classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase="
http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0"
width="720" height="275" align="absmiddle">
<param name="movie" value="mntp_top_1.swf" />
<param name="quality" value="high" />
<embed src="mntp_top_1.swf" width="720" height="275"
align="absmiddle" quality="high" pluginspage="
http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash"
type="application/x-shockwave-flash"></embed>
</object></noscript></td>
</tr>
<tr>
<td><div class="width720" align="center">
<div id="onlyBottom">

<table width="720" border="0" cellspacing="0"
cellpadding="0" align="center">
<tr>
<td valign="top"><strong><span
class="style2"> WELCOME
</span> <span class="style3">TO THE MNTP WEBSITE
!</span></strong><br />
<br /></td>
</tr>
<tr>
<td>

<table width="680" border="0" cellspacing="0"
cellpadding="0">
<tr>
<td width="160" valign="top">
<div class=" leftmenuContainer">
<div class=" leftMenu">
<span class="leftmenuText"><strong>
CNBC <br>
Graduate Program <br>
Link 1 <br>
Link 1 <br>
Link 1 <br>
Link 1 <br>
</strong>
</span>
</div>
</div>
</td>
<td width="520" valign="top">

<div class=" box_1_Container">
<div class=" box_1_Menu">
<span class="style2"><strong>StatsReader v2.1
HowTo:</strong></span> <br>
<span class="basestyle">
New in 2.0: if setting target size to "0" you can use
StatsReader
to add keyframes in desired locations. Make sure to use a
different
filename for the target file and set that file up in xvid as
first
pass statsfile. Since the frametypes are gathered from the
first
pass file, setting them only in a ... more
</span>
</div>
</div>

<p><span
class="clearText">T</span></p>

<div class=" box_1_Container">
<div class=" box_1_Menu">
<span class="style2"><strong>TYPES OF LICENSES:
</strong></span> <br>
<span class="basestyle">
In order to install and use the Software, You must obtain
one of the following two types of licenses: (1) Evaluation
License or (2) Commercial Use License.
If You would like to try using the Software before
purchasing a Commercial Use License, then You may wish to
obtain an Evaluation License. This will allow You to use
the Software for free for a period of up to thirty (30)
</span>
</div>
</div>

</td>
</tr>
</table>

</td>
</tr>
<tr>
<td ><div class=" bottommenuContainer">
<div class="bottomMenu"
align="center"><br><span
class="bottommenuText">Number 1 in someclass where all have
height:100px</span>
</div>
</div></td>
<td width="0"></td>
</tr>
</table>

</div>
</div></td>
</tr>
<tr>
<td width="0"></td>
</tr>
</table>
</body>
</html>
Thanks

I can tell you no one will wade through all of this code.
Just glancing at it and I can see all sorts of problems. You need
to isolate the problem and work on the basic structure of your
page.
I would recommend starting again and use a good semantic
guide to building Web pages. Go for a book that uses well formed
html and CSS for layout and styling. I would definitely advise you
to avoid table layouts, especially if you want to get the best
chance of seeing your designs render correctly in all modern
browsers.
Try HTML Mastery and CSS Mastery, both published by Friends
of Ed, and armed with these books you will have a great start on
the road to design heaven!
Regards

CSS Box Problem

Similar Messages

Maybe you are looking for