Изменение положения тегов DIV AP в Dreamweaver - PullRequest
0 голосов
/ 17 сентября 2011

Когда я изменяю положение с абсолютного на относительное или что-то еще, это полностью все испортило. Отправка изображений везде на макете. Я не знаю что делать. Пожалуйста, помогите = [[Потому что в нынешнем виде, когда браузер мамизирован, текст выглядит не так, как размещение на макете в зависимости от компьютера, на котором я его тестирую. Сайт - www.byteknightrepair.com

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org      /TR/html4/loose.dtd">
<html>
<head>
<title>-ByteKnight Repair-</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="site_layout.css" rel="stylesheet" type="text/css">
<style type="text/css">
body {
    background-color: #2b2b2b;
}
</style>
<link href="site_layout_content.css" rel="stylesheet" type="text/css">
<style type="text/css">
#testimonials {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 220px;
top: 563px;
float: right;
}
body,td,th {
color: #999;
}
#housecalls {
position:absolute;
width:200px;
height:105px;
z-index:2;
left: 504px;
top: 557px;
}
#WhatWeDo {
position:;
width:379px;
height:46px;
z-index:3;
left: 201px;
top: 222px;
}
</style>
<link href="site_layout_whatwedo.css" rel="stylesheet" type="text/css">
<style type="text/css">
#Description {
position:absolute;
width:326px;
height:73px;
z-index:4;
left: 219px;
top: 289px;
}
#news {
position:absolute;
width:200px;
height:115px;
z-index:5;
left: 804px;
top: 556px;
}
#apDiv6 {
position:absolute;
width:200px;
height:115px;
z-index:6;
left: 721px;
top: 390px;
}
</style>

1 Ответ

0 голосов
/ 17 сентября 2011

Вао, хорошо, мое первое предложение - начать все заново и правильно расположить все. Текст на вашей странице летит повсюду, потому что он не содержит должным образом и просто вручную расположен по всему экрану, абсолютно точно по отношению к экрану, который вы использовали в то время, поэтому они летают везде (не у всех одинаковый экран размер). Вот несколько вещей, которые вы можете сделать, чтобы быстро исправить:

td {
    vertical-align:top;
}

#description {
    padding:30px;
    position:absolute;
    width:326px;
}

Позже удалите ваш div "What we do" и просто поместите его в ваш div "description", вот так:

<div id="Description">
<h2>What we do</h2>
<p>ByteKnight Repair is a local, San Fernando Valley based computer repair and servicing company that services both PC desktops and laptops of all brands.</p></div>

Это должно помешать тому фрагменту текста плавать при изменении размера экрана.

Теперь перейдите на страницу с ценами.

Сначала отформатируйте свой # apDiv5 id для этого:

#apDiv5 {
    color:#ccc;
    font-family:"Trebuchet MS",Arial,Helvetica,sans-serif;
    font-size:12px;
    position:absolute;
    width:255px;
}

И затем исправьте td, заключающий в себе этот div, поместив изображение «под» содержимым, вот так:

<td colspan="3" rowspan="4">
        <div id="apDiv5">
          <p>The squire tune-up includes: </p>
          <ul>
            <li>Clear Cache</li>
            <li>Clear Pagefiles</li>
            <li>Virus Scan</li>
            <li>Virus Removal</li>
            <li>Spyware Scan</li>
            <li>Spyware Removal</li>
            <li>Registry Cleaning</li>
            <li>Registry Defragmentation</li>
            <li>Hard Drive Test</li>
            <li>RAM Test</li>
            <li>CPU Thermal Test</li>
            <li>Configure Windows Updates</li>
            <li>Remove Unneeded Startup Programs</li>
          </ul>
      </div><img width="260" height="350" src="images/prices_28.jpg" alt="">
</td>

Кроме того, в разделе «Knightly Tune-up» измените идентификатор # apDiv4 для этого div на # apDiv5 .

Это должно решить большинство ваших проблем с выравниванием, хотя я настоятельно рекомендую начинать с нуля, вы можете легко расположить такой дизайн с помощью одних таблиц. Также попробуйте внести все эти изменения через обычный редактор, а не через визуальный редактор.

Как всегда, если он работает, он работает, независимо от того, как он настроен. Удачи.

...