Quantcast
Channel: Adobe Community: Message List
Viewing all articles
Browse latest Browse all 72601

How to override the gutter while using fluid grid layouts?

$
0
0

Hello,

My problem occurs when I try to take two of my divs within the fluid grid layout and make them so that they lie flush together. I have removed the left margin from the right side div and this makes the two divs side by side in the designer view. However when I take a look at the site in IE or Chrome there is still a gap between the div's where the gutter is at.

 

I'm not sure exactly what this technique is called but I am trying to get the look that it is beveled and it separates the columns. problem w divs.pngThe two areas where the circles are at are where I want the divs to be moved over to line up side by side with the other. It is suppose to look like this.

correct.png

 

As I mentioned earlier I am using the Fluid grid layout. I'm sure there has to be some way to be able to move the div's over. However I believe the problem may have to do with the divs being "locked" to the grids. I have tried removing the margin-left that divs had, this appeared to fix the problem in DW but it actually doesn't after I test it.

 

I am fairly new to DW but I have been able to pull this off thus far and this is the only problem that is holding me back from finishing up this site.

 

One other idea that i had was to just wrap the 3 content layers that i want to be together and to put them into a div that surrounds all 3, and set the background image of that main div to this image. The problem with that though is that as the page scales down the image gets cut off and then before you know it I don't have the look I want anymore. If there is a way to make the background image maintain its width and scale with the page, I think this might be an easier fix.

 

If anyone has any ideas as to how to fix this please let me know.

Thank you in advance


Viewing all articles
Browse latest Browse all 72601

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>