/    Sign up×
Community /Pin to ProfileBookmark

Easy Code Fix

Copy linkTweet thisAlerts:
Mar 31.2011

The site is split into two main “div id” tags top half (header, links) and a bottom half (content, extra links) with div class in each. Im having trouble figuring out how to add a “div id Column” on the left side with site remaining centered. Go to the site home page to see the exsisting floating div on the left, then resize your browser window to see the problem with the content overlapping, also in the header banner the toll free number img, is also being over laped. Before receiving payment I must be able to verify the fix, probably best with prgrammers with servers or send the code. payment will be through paypal.

website: [url]http://www.amsprocess.com[/url]

Link to download .css, layout, and index. etc –>[url]http://assurancemerchantsolutions.com/index_code.rar[/url]

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”en” lang=”en”>

<head>
<title></title>
<link href=”style.css” rel=”stylesheet” type=”text/css” />
<link href=”layout.css” rel=”stylesheet” type=”text/css” />
<script src=”rollover.js” type=”text/javascript”></script>
<script src=”maxheight.js” type=”text/javascript”></script>

<body id=”page3″ onload=” new ElementMaxHeight(); MM_preloadImages(‘images/m1_1.jpg’,’images/m2_2.jpg’,’images/m3_3.jpg’,’images/m4_4.jpg’,’images/m5_5.jpg’)”>
<div class=”site_center”>

<div id=”header”>
<div class=”top”>
fkldfldfflkfjldfjldfdjfflfjdlksfjldjfdjfjf <– top is header banner>
</div>

<div id=”content”>
<div class=”width_100″>

<div class=”col1 list maxheight”>
<div class=”color maxheight”>
<div class=”bg_color_top maxheight”>
<div class=”bg_color_bot maxheight”>
<div class=”bg_color_left maxheight”>
<div class=”bg_color_right maxheight”>
<div class=”y_top_right maxheight”>
<div class=”y_top_left maxheight”>
<div class=”y_bot_right maxheight”>
<div class=”y_bot_left maxheight”>
<div class=”indent_color1″>

dld;jlkdjflksfjkljfkd
kdjfkldsjflsdjfldfjd <—bottom div split into 2 sections> left side

</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<div class=”col2″><img alt=”” src=”images/spacer.gif” width=”5″ height=”1″ /></div>
<div class=”col3 border maxheight”>
<div class=”indent1″>
dkljfkdlsjfldsfjkldjfkldsjflk <-right side of bottom div id>

</div>
</div>
<div class=”clear”></div>
</div>
</div>
<div id=”footer”>
jlkdjfaklsdjfdkjflkasjfdjflfjasdfjsklfjljf footer html
</div>
</div>
</body>
</html>

to post a comment
CSS

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@jalarieApr 02.2011 — Opera claims that your CSS has a problem with:
<i>
</i> cl{font-size:11px; list-style: solid circle; color:black; }

I think "solid circle" should be "disk" for starters.

That problem could be killing other things. Do you have any kind of indent on your main content to keep it from hitting the left edge?
Copy linkTweet thisAlerts:
@PhoubersApr 02.2011 — If I understand correctly, you want to have the page centered while having a left column and to the right the two rows that are already there.

Create one main div to center the page.

Create another div that floats left with a set width, this is your left column.

Create another div that floats right with a set width, this will be the larger right column which should contain the two orginal divs.

It should look something like this:

CSS:
[CODE]
#container{
width:1000px;
margin: 0 auto;
}

.left{
width:200px;
float:left;
}

.right{
width:800px;
float:right;
}
[/CODE]

HTML
[code=html]
<div id="container">
<div class="left">
THIS IS WHERE YOUR LEFT COLUMN CONTENT GOES
</div>
<div class="right">
THIS IS WHERE YOUR RIGHT COLUMN CONTENT GOES
</div>
</div>
[/code]

I do this for my site, wcTutorials, and it works fine, just take a look at the source code and you'll see that it does what your trying to do.
Copy linkTweet thisAlerts:
@Slimpick404authorApr 04.2011 — Thank you so much for the help, i still need to figure it out, im working on your suggestion it makes since, its just still difficult for me to make it stay without the overlapping.
Copy linkTweet thisAlerts:
@Slimpick404authorApr 04.2011 — Thanks Jalarie , for your help not sure how cl{font-size:11px; list-style: solid circle; color:black; } affects the div tag overlapping ?
×

Success!

Help @Slimpick404 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.3,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...