Menu
i have now decided to supply the full code for the whole page in case something else in my page is causing the problems…
i have managed to get so far but now i can not get a padding in side the middle section of the speech bubble to have the text in it, when i change the padding the page goes weird and does not show the same view in IE either.
can anyone please suggest a way to get around this.
quote: i did try the suggestion above from HAKU but this too messed up the page as well like when i change the values of the padding from 0px to something else like 5px or 10px on the left and right of the middle bubble image box.
also i have new images…
[code]
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
<html>
<head><title></title>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
<style type=”text/css”>
/* CSS Document */
/* Standard View CSS */
body { margin: 0; padding: 0; }
#body_container { padding: 0; margin: 0 auto; width: 700px; }
#header_container { padding: 0; margin: 0; width: 700px; height: 141px; background-color: #6193BF; }
#header_welcome_to { font-weight: normal; font-size: 2em; line-height: 1em; }
#header_sitename { font-weight: normal; font-size: 5em; line-height: 1em; }
#header_sub { font-weight: normal; font-size: 1.05em; font-weight: bold; line-height: .5em; color: #99FFFF; }
#header_powered { font-size: .7em; line-height: 3.6em; }
#logo { float: left; background-image:url(images/logo.png); width: 136px; height: 139px; background-repeat: no-repeat; }
#left { float: left; }
#right { float: right; }
input { font-size: 8pt; color: #333333; background-color: #FFFFFF; }
div.center { text-align: center; }
option.center { text-align: center; }
a.nd { text-decoration: none; }
#loginbox_message { color: #FF6600; }
#loginbox { float:left; padding-top: 30px; width:140px; /* the width here should be the same as the ‘maincontent’ id in ‘style_extras_not_logged_in.css’ file */ }
#loginbox_text { font-size: 9pt; color: #333333; text-align: left; }
#main_left_container { width:50%; float:left; overflow:auto; } /* */ /* the width should be the same as the width in the main_right_container */
#main_left_content { padding: 10px; } /* background: yellow; */
#main_right_container { margin-left:50%; } /* background: blue; */ /* the width should be the same as the width in the main_left_container */
#main_right_content { padding: 10px; } /* background: green; */
#menubar { text-align: center; color: #FF0000; padding: 0; margin: 0; }
#welcome_username { align: left; font-size: 30px; font-weight: bold; }
.clear { height: 0; font-size: 1px; margin: 0; padding: 0; line-height: 0; clear: both; }
#testimonial_text { text-align: justify; font-weight: normal; font-style: italic; font-size: 10pt; color: #333333; padding: 8px 8px 8px 8px; }
#testimonial_name { font-weight: bold; font-style: italic; font-size: 10pt; color: #333333; }
#text_size10pt { font-size: 10pt; color: #333333; }
#text_size15pt { font-size: 15pt; color: #333333; }
#list_arrow { padding-top: 4px; list-style-position:outside; list-style-image: url(images/bullet_arrow.jpeg) }
#bubble_container { padding: 0; margin: 0 auto; width: 155px; }
#bubble_top { border: 1px solid #555555;margin: 0 auto; height: 15px; width: 100%; background: url(images/speech%20bubbles%20-%20top.png) no-repeat; background-position: center; }
#bubble_mid { border: 1px solid #555555;margin: 0 auto; text-align: justify; width: 100%; padding: 0 0px 15px 0px; background: url(images/speech%20bubbles%20-%20center.png) repeat-y; background-position: center; font-size: 9pt; line-height: 12px; }
#bubble_bot_left { border: 1px solid #555555;margin: 0 auto; height: 17px; width: 100%; background: url(images/speech%20bubbles%20-%20bottom_left.png) no-repeat; background-position: center; }
#bubble_bot_right { border: 1px solid #555555;margin: 0 auto; height: 17px; width: 100%; background: url(images/speech%20bubbles%20-%20bottom_right.png) no-repeat; background-position: center; }
#about_fix_left { float: left; padding: 10px 0 0 25px; font-size: 8pt; }
#about_fix_right { float: right; padding: 10px 25px 0 0; font-size: 8pt; }
#username_left { text-align: left; font-size: 15px; font-weight: bold; }
#username_right { text-align: right; font-size: 15px; font-weight: bold; }
/* top right bottom left */
/*
.blinking { text-decoration: blink; }
*/
/* Chat View CSS */
#chat_container { padding: 0; margin: 0 auto; width: 699px; }
#div_chat { height: 300px; width: 500px; overflow: auto; background-color: #CCCCCC; border: 1px solid #555555; }
#txt_message { width: 447px; }
#admin_user { font-weight: normal; font-size: 20px; }
#admin_message { font-weight: normal; font-style: italic; font-size: 20px; color: #990099; }
#chat_time { font-weight: normal; font-style: italic; font-size: 9px; }
#user { font-weight: normal; font-style: italic; font-size: 20px; }
#user_list { float: left; height: 290px; width: 100px; overflow: auto; background-color: #DDDDDD; padding: 3px; margin: 3px; }
/* Mobile View CSS */
#mobile_txt_message { width: 180px; }
#mobile_div_chat { height: 200px; width: 200px; overflow: auto; background-color: #CCCCCC; border: 1px solid #555555; }
#maincontent { padding-left:140px; /* the width here should be the same as the ‘loginbox’ id in ‘style.css’ file */ }
</style>
</head>
<body>
<div id=”body_container”>
<div id=”header_container”>
<div id=”logo”></div>
<div><strong id=”header_welcome_to”>Welcome to </strong><strong id=”header_sitename”>site</strong>
</div>
<div><strong id=”header_sub”> text</strong>
</div>
<div> </div>
<div><strong id=”header_powered”>text</strong>
</div>
</div>
<div id=”menubar”>
<a href=”?” class=”nd”><em>Home</em></a>
</div>
<div id=”loginbox”>
<form name=”loginbox” method=”post” action=”auth.php”><div id=”loginbox_text”>Username<br><input size=”20″ type=”text” name=”name”></div>
<div id=”loginbox_text”>Password<br><input name=”password” type=”password” size=”20″></div>
<div class=”center”><input type=”submit” value=”Log In” name=”login”><input type=”reset” value=”Reset” name=”reset”></div>
<div class=”center”><a href=”?”>forgot password</a></div>
</form>
</div>
<div id=”maincontent”>
<div id=”main_left_container”>
<div id=”main_left_content”>
some info here<br><br><br>
some info here<br><br>
some info here<br><br>
<br><br>
</div>
</div>
<div id=”main_right_container”>
<div id=”main_right_content”>
<div class=”center”><strong id=”text_size15pt”>What users say</strong></div>
<div id=”bubble_container”>
<div id=”bubble_top”></div>
<div id=”bubble_mid”>big thank you! cheers to
you…<div id=”about_fix_right”><a href=”?fid=1″ class=”nd”>more info</a></div>
</div>
<div id=”bubble_bot_left”></div>
<div id=”username_left”>name</div>
</div>
<br>
<div id=”bubble_container”>
<div id=”bubble_top”></div>
<div id=”bubble_mid”>big thank you! cheers to
you…<div id=”about_fix_right”><a href=”?fid=1″ class=”nd”>more info</a></div>
</div>
<div id=”bubble_bot_left”></div>
<div id=”username_left”>name</div>
</div>
<br>
<div id=”bubble_container”>
<div id=”bubble_top”></div>
<div id=”bubble_mid”>big thank you! cheers to
you…<div id=”about_fix_right”><a href=”?fid=1″ class=”nd”>more info</a></div>
</div>
<div id=”bubble_bot_left”></div>
<div id=”username_left”>name</div>
</div>
<br>
<div id=”bubble_container”>
<div id=”bubble_top”></div>
<div id=”bubble_mid”>big thank you! cheers to
you…<div id=”about_fix_right”><a href=”?fid=1″ class=”nd”>more info</a></div>
</div>
<div id=”bubble_bot_left”></div>
<div id=”username_left”>name</div>
</div>
<br>
<br>
<div class=”center”><div id=”text_size10pt”><a href=”?ac=te” class=”nd”>click here for more</a></div></div>
</div>
</div>
</div>
<div class=”clear”></div>
<br><br><br>
</div>
</body>
</html>
[upl-file uuid=f12267aa-d51b-4dfc-82a6-d5774e48bb04 size=424B]speech bubbles – top.png
[upl-file uuid=a94a2576-ff8d-4e17-9c1a-c761fc55b6ba size=134B]speech bubbles – center.png
[upl-file uuid=e12371ca-3105-4633-b0f5-cc65e04f15f6 size=575B]speech bubbles – bottom_right.png
[upl-file uuid=0771950f-f997-4a09-9cac-ceac06faf1e7 size=577B]speech bubbles – bottom_left.png