Home/ Questions/Q 3444054
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T08:52:03+00:00

I have the following code: <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd> <html

  • 0

I have the following code: 

<!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>
        <style type="text/css">
            .panel
            {
                border: 1px solid black;
                background: #f2f2f2;
            }

            #after-top
            {
                position: absolute;
                top: 90px;
                left: 1px;
                right: 1px;
                font-size: 16px;
            }

            #languages
            {
                width: 120px;
                text-align: center;
                float: left;
            }

            #location
            {
                float: left;
                margin: 0 1px 0 1px;  
            }
        </style>
    </head>
    <body>
        <div id="after-top">
            <span class="panel" id="languages"><span>English</span>&nbsp;|&nbsp;<span>Русский</span></span>
            <span class="panel" id="location">&nbsp;</span>
        </div>
    </body>
</html>

This produce some thing like:

+-------------------+ +-+
| English | Russian | | |
+-------------------+ +-+

I want second div stretched till end of screen minus 1px.
Some thing like:

+-------------------+ +--------------------------------------------------------+
| English | Russian | |                                                        |
+-------------------+ +--------------------------------------------------------+

And when I wil upzoom the screen I don’t want effects like:

+-------------------+
| English | Russian |
+-------------------+
            +-----------------------------------------------------------+
            |                                                           |
            +-----------------------------------------------------------+

But (when I will upgrade zoom of window) something like:

+-------------------+ +------------------------------+
| English | Russian | |                              |
+-------------------+ +------------------------------+
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Use overflow:hidden:

    #panel {
    display: block;
}
#after-top, #location {
    overflow: hidden;
}
#languages {
    float: left;
}
    • 0