Databases
StackOverflow2013
Postsdbo
POBackground and menubar gets disproportioned on wider screen... I do not want this
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POBackground and menubar gets disproportioned on wider screen... I do not want this
    primarykey
    data
    text
    <p>I've been researching, but I'm not sure how to look for what I want. I am in my first term of HTML and CSS. My page looks great on my 15 1/2 inch monitor... but when I move it to my 19 1/2 monitor, it adds another part of the background image to the right side, and stretches the menubar across the whole distance. What code am I looking for that will keep the page intact on a wider screen, perhaps adding colored (or blank) borders on each side? Thank you for your help.</p> <p>Thank you to Brad and Fiddle for helping. The no-repeat helped the background, however, on the bigger monitor, my menubar wants to go clear across, and the .box and img.posit want to stick to the far left side. I'd rather they stay measured according to the background image.</p> <p>thes style sheet:</p> <pre><code>body {font-family:Arial, Verdana, Garamond; background-image: beach.jpg; background-repeat: no-repeat; background-position: center;} a {text-decoration: none; color: #FF4D10; font-size: 14pt;} a:hover {background-color: white;} .menu {position:center; text-align: center; width: 100%; margin: 0; text-decoration: none;} .menuword {width: 10%; background-color: beach.jpg; font-weight: 500; text-decoration: none;} .menuwordselect {width: 10%; font-weight: bolder; font-style: italic; text-decoration: none;} .menupipe {width: 0%; font-weight: bolder;} .box {width: 400px; margin-left: 25px; margin-top: 100px; border-radius: 7px; background-color: #ffff9c; padding: 10px; color: #303032;} /* set styles for class named box to position the image */ img.posit {position: relative; left: 550px; top: -435px } /* sets styles for class named posit to position the image */ </code></pre> <p>I really appreciate your help :)</p> <p>Brad... here is the code for the page...</p> <pre><code>&lt;body background="beach.jpg"&gt; &lt;div style="text-align: center;"&gt; &lt;img src="Oahu banner.jpg" width="995" height="295"&gt; &lt;table class="menu"&gt; &lt;tr&gt; &lt;td class="menuword"&gt;&lt;a href="sitemap.html"&gt;Waikiki&lt;/a&gt;&lt;/td&gt; &lt;td class="menupipe"&gt;|&lt;/td&gt; &lt;td class="menuword"&gt;&lt;a href="script.html"&gt;North Shore&lt;/a&gt;&lt;/td&gt; &lt;td class="menupipe"&gt;|&lt;/td&gt; &lt;td class="menuword"&gt;&lt;a href="cast.html"&gt;Cultural and Historical&lt;/a&gt;&lt;/td&gt; &lt;td class="menupipe"&gt;|&lt;/td&gt; &lt;td class="menuword"&gt;&lt;a href="costumes.html"&gt;Best Deal Ever&lt;/a&gt;&lt;/td&gt; &lt;td class="menupipe"&gt;|&lt;/td&gt; &lt;td class="menuword"&gt;&lt;a href="set.html"&gt;More Info&lt;/a&gt;&lt;/td&gt; &lt;td class="menupipe"&gt;|&lt;/td&gt; &lt;td class="menuword"&gt;&lt;a href="props.html"&gt;Site Map&lt;/a&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;div&gt; &lt;p class="box"&gt;Oahu known as "The Gathering Place", is the third largest of the Hawaiian Islands and home to more than 950,000 people, almost 75% of the U.S. state of Hawaii's population. The state capital, Honolulu, is on Oahu's southeast coast. In the greatest dimension, this volcanic island is 44 miles (71 km) long and 30 miles (48 km) across. The length of the shoreline is 227 miles (365 km). The island is the result of two separate shield volcanoes: Wai'anae and Ko'olau, with a broad "valley" or saddle, the Oahu Plain between them. The highest point is Mt. Ka'ala in the Wai'anae Range, rising to 4,003 feet (1,220 m) above sea level. &lt;br&gt;&lt;br&gt; But there is more to Oahu than just height and width. Honolulu, the state's capital, not only displays an impressive skyline of highrises, but also the beautiful beach of Waikiki, where Duke Kahanamoku "the father of surfing" developed his surfing and swimming skills. &lt;br&gt;&lt;br&gt;Across the pineapple fields at the middle of the island, the North Shore is home to modern day world renown surfing competitions, prolific fruit plantations and a quiet, rural lifestyle for many residents. &lt;br&gt;&lt;br&gt;The cultural heritage of the native peoples is richly preserved in many world class museums, libraries and attractions. Pearl Harbor as an important piece of our American history is a must see stop for all visitors. &lt;br&gt;&lt;br&gt;There is something for everyone on this beautiful tropical island. Come vist and Hang Loose in Oahu!&lt;/p&gt; &lt;img class="posit" src="waterfallbig.jpg" width="513" height="386" alt="Waterfall" /&gt; &lt;/div&gt; &lt;/body&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USSue Long Smith
    1. USSue Long Smith
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COPost your code. Otherwise, it's quite difficult to help you. Also, monitor physical size has nothing to do with this... pixel dimensions matter. You probably want `background-repeat: no-repeat` in your CSS.
      singulars
      1. POBackground and menubar gets disproportioned on wider screen... I do not want this
      1. USBrad
    2. COThank you Brad, here is my code
      singulars
      1. POBackground and menubar gets disproportioned on wider screen... I do not want this
      1. USSue Long Smith
    3. COCan you edit your post and put the code there?
      singulars
      1. POBackground and menubar gets disproportioned on wider screen... I do not want this
      1. USBrad
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload