將圖片移動到頁面右側

Question

我需要一些專家幫助！

我想將圖片移動到div的右側，但是當我「浮動：正確」時;圖片剛剛移出它所在的最初div。圖像不斷移出的div是「日常閱讀」div，出於某種原因，如果不離開它，它就會無法向右移動那個div。我試圖讓照片坐在我的段落右側，因爲這些段落是我需要它們的地方。任何人誰可以幫助將不勝感激！

這裏是我的代碼： （在DIV出發，我們正在尋找）

body { 
 
    padding: 0; 
 
    margin: 0; 
 
    font-family: 'Josefin Sans', sans-serif; 
 
} 
 

 
#main-slider { 
 
    height: 100%; 
 
    width: 100%; 
 
} 
 

 
.main-menu-list { 
 
    color: white; 
 
    float: right; 
 
    padding-left: 7px; 
 
    position: relative; 
 
    bottom: 640px; 
 
} 
 

 
#menu-contact { 
 
    margin-right: 7px; 
 
} 
 

 
#daily-reading { 
 
    background-color: #F0F1F2; 
 
    position: relative; 
 
    bottom: 22px; 
 
} 
 

 
#daily-reading-heading { 
 
    text-align: center; 
 
    margin-left: 185px; 
 
    padding: 10px 0 1px; 
 
} 
 

 
#daily-post p { 
 
    width: 600px; 
 
    margin-left: 10px; 
 
} 
 

 
#daily-post-picture { 
 
} 
 

 
#daily-post-picture img { 
 
    height: 200px; 
 
}

<div id="daily-reading"> 
 

 
    <h1 id="daily-reading-heading">Today's Reading</h1> 
 

 
    <div id="daily-post"> 
 
    <p>For we are God’s workmanship, created in Christ Jesus to do good works, which God prepared for us in advance to do. –Ephesians 2:10 
 

 
    <p>Consider the following quote:</p> 
 

 
    <p>"I am only one, but I am one; 
 
     I cannot do everything 
 
     But I can do something. 
 
     What I can do, I ought to do 
 
     And what I ought to do 
 
     By the grace of God, I will do." 
 
     – Canon Farrar</p> 
 

 
    <p>We live in a culture that constantly shines a spotlight on the famous: pretty or especially gifted people (or both!) We live in a celebrity-focused culture. Just think about all of the media devoted to celebrities. It would be great if the church was immune from this culture, but it isn’t. Even the Christian community tends to highlight our best people; from musicians to speakers, to those involved in doing incredible ministry. While I’m not saying that spotlighting is wrong, I am concerned that there are many of us who become disheartened because we know our efforts don’t approach the skills or successes of those of the extremely gifted. I am concerned that some of us give up attempting to make a difference when we think we can’t measure up.</p> 
 

 
    <p>True, we may never be celebrities in the eyes of the world or even within the Christian community. But, God doesn’t call us to be famous. He calls us to love one another. He calls us to give ourselves away to serve others. The needs of our world are great, and we cannot do everything. Still, as part of the body of Christ, we have a unique and invaluable role to play. God has purposely designed us for accomplishing good works in His name.</p> 
 

 
    <p>Stop playing the comparison game. Anyone who plays that game loses. There will always be someone else who does things better or is more effective. We are called to serve the Lord. Our desire should be solely to please Him. Serve Him today to the best of your abilities. Your service will be a sacrifice of praise to the King.</p> 
 

 
    <div id="daily-post-picture"> 
 
     <img src="https://placehold.it/100"> 
 
    </div> 
 

 
    </div> 
 
</div>

Answer 1

移動DIV #daily-post-picture上面的段落和應用float:right;

body { 
 

 
padding: 0px; 
 
margin: 0px; 
 
font-family: 'Josefin Sans', sans-serif; 
 

 
} 
 

 
#main-slider { 
 

 
height: 100%; 
 
width: 100%; 
 

 
} 
 

 

 

 
.main-menu-list { 
 

 
color:white; 
 
float: right; 
 
padding-left: 7px; 
 
position: relative; 
 
bottom: 640px; 
 

 
} 
 

 
#menu-contact { 
 

 
margin-right:7px; 
 

 
} 
 

 
#daily-reading { 
 

 
background-color: #F0F1F2; 
 
position: relative; 
 
bottom: 22px; 
 

 
} 
 

 
#daily-reading-heading { 
 

 
text-align: center; 
 
margin-left: 185px; 
 
padding: 10px 0 1px 0; 
 
} 
 

 
#daily-post p { 
 

 
width: 600px; 
 
margin-left: 10px; 
 

 
} 
 

 

 
#daily-post-picture { 
 

 
float: right; 
 
margin: 0 0 20px 20px; 
 

 
} 
 

 
#daily-post-picture img { 
 

 
height: 200px; 
 

 

 
}

<div id="daily-reading"> 
 

 
     <h1 id="daily-reading-heading">Today's Reading</h1> 
 

 
      <div id="daily-post-picture" style="float:right"> 
 

 
       <img src="photos/bible-reading.jpg"> 
 

 
      </div> 
 
     <div id="daily-post"> 
 
      <p>For we are God’s workmanship, created in Christ Jesus to do good works, which God prepared for us in advance to do. –Ephesians 2:10 
 

 
      <p>Consider the following quote:</p> 
 

 
      <p>"I am only one, but I am one; 
 
      I cannot do everything 
 
      But I can do something. 
 
      What I can do, I ought to do 
 
      And what I ought to do 
 
      By the grace of God, I will do." 
 
       – Canon Farrar</p> 
 

 
      <p>We live in a culture that constantly shines a spotlight on the famous: pretty or especially gifted people (or both!) We live in a celebrity-focused culture. Just think about all of the media devoted to celebrities. It would be great if the church was immune from this culture, but it isn’t. Even the Christian community tends to highlight our best people; from musicians to speakers, to those involved in doing incredible ministry. While I’m not saying that spotlighting is wrong, I am concerned that there are many of us who become disheartened because we know our efforts don’t approach the skills or successes of those of the extremely gifted. I am concerned that some of us give up attempting to make a difference when we think we can’t measure up.</p> 
 

 
      <p>True, we may never be celebrities in the eyes of the world or even within the Christian community. But, God doesn’t call us to be famous. He calls us to love one another. He calls us to give ourselves away to serve others. The needs of our world are great, and we cannot do everything. Still, as part of the body of Christ, we have a unique and invaluable role to play. God has purposely designed us for accomplishing good works in His name.</p> 
 

 
      <p>Stop playing the comparison game. Anyone who plays that game loses. There will always be someone else who does things better or is more effective. We are called to serve the Lord. Our desire should be solely to please Him. Serve Him today to the best of your abilities. Your service will be a sacrifice of praise to the King.</p> 
 

 

 
     </div> 
 
    </div>

Answer 2

你只是試試這個

<!DOCTYPE html> 
<html> 
<head> 
    <title>stack</title> 
</head> 
<body> 
    <div id="daily-reading"> 
     <h1 id="daily-reading-heading">Today's Reading</h1> 
     <div id="daily-post"> 
      <div id="daily-post-picture"> 
       <img src="photos/bible-reading.jpg"> 
      </div> 
      <div id="daily-post-content"> 
       <p>For we are God’s workmanship, created in Christ Jesus to do good works, which God prepared for us in advance to do. –Ephesians 2:10 

       <p>Consider the following quote:</p> 

       <p>"I am only one, but I am one; 
        I cannot do everything 
        But I can do something. 
        What I can do, I ought to do 
        And what I ought to do 
        By the grace of God, I will do." 
        – Canon Farrar</p> 

        <p>We live in a culture that constantly shines a spotlight on the famous: pretty or especially gifted people (or both!) We live in a celebrity-focused culture. Just think about all of the media devoted to celebrities. It would be great if the church was immune from this culture, but it isn’t. Even the Christian community tends to highlight our best people; from musicians to speakers, to those involved in doing incredible ministry. While I’m not saying that spotlighting is wrong, I am concerned that there are many of us who become disheartened because we know our efforts don’t approach the skills or successes of those of the extremely gifted. I am concerned that some of us give up attempting to make a difference when we think we can’t measure up.</p> 

        <p>True, we may never be celebrities in the eyes of the world or even within the Christian community. But, God doesn’t call us to be famous. He calls us to love one another. He calls us to give ourselves away to serve others. The needs of our world are great, and we cannot do everything. Still, as part of the body of Christ, we have a unique and invaluable role to play. God has purposely designed us for accomplishing good works in His name.</p> 

        <p>Stop playing the comparison game. Anyone who plays that game loses. There will always be someone else who does things better or is more effective. We are called to serve the Lord. Our desire should be solely to please Him. Serve Him today to the best of your abilities. Your service will be a sacrifice of praise to the King.</p> 
      </div> 
     </div> 
    </div> 
</body> 
</html> 

<style type="text/css"> 
body { 
    padding: 0px; 
    margin: 0px; 
    font-family: 'Josefin Sans', sans-serif; 
} 

#main-slider { 
    height: 100%; 
    width: 100%; 
} 

.main-menu-list { 
    color:white; 
    float: right; 
    padding-left: 7px; 
    position: relative; 
    bottom: 640px; 
} 

#menu-contact { 
    margin-right:7px; 
} 

#daily-reading { 
    background-color: #F0F1F2; 
    position: relative; 
    bottom: 22px; 
} 

#daily-reading-heading { 
    text-align: center; 
    margin-left: 185px; 
    padding: 10px 0 1px 0; 
} 

#daily-post p { 
    width: 600px; 
    margin-left: 10px; 
} 

#daily-post-picture { 
    float: left; 
    width: 50%; 
} 

#daily-post-content{ 
    float: right; 
    width: 50%; 
} 

#daily-post-picture img { 
    height: 200px; 
} 
</style> 

Answer 3

而是改變位置的image.You可申請職位：絕對給它

檢查這個片段

body { 
 
    padding: 0; 
 
    margin: 0; 
 
    font-family: 'Josefin Sans', sans-serif; 
 
} 
 
#main-slider { 
 
    height: 100vh; 
 
    width: 100vw; 
 
} 
 
#menu-contact { 
 
    margin-right: 7px; 
 
} 
 
#daily-reading { 
 
    background-color: #F0F1F2; 
 
    position: relative; 
 
    bottom: 22px; 
 
} 
 
#daily-reading-heading { 
 
    text-align: center; 
 
    margin-left: 185px; 
 
    padding: 10px 0 1px; 
 
} 
 
#daily-post p { 
 
    width: 600px; 
 
    margin-left: 10px; 
 
} 
 
#daily-post-picture {} #daily-post-picture img { 
 
    position: absolute; 
 
    top: 0; 
 
    right: 0; 
 
}

<div id="daily-reading"> 
 

 
    <h1 id="daily-reading-heading">Today's Reading</h1> 
 

 
    <div id="daily-post"> 
 
    <p>For we are God’s workmanship, created in Christ Jesus to do good works, which God prepared for us in advance to do. –Ephesians 2:10 
 

 
     <p>Consider the following quote:</p> 
 

 
     <p>"I am only one, but I am one; I cannot do everything But I can do something. What I can do, I ought to do And what I ought to do By the grace of God, I will do." – Canon Farrar</p> 
 

 
     <p>We live in a culture that constantly shines a spotlight on the famous: pretty or especially gifted people (or both!) We live in a celebrity-focused culture. Just think about all of the media devoted to celebrities. It would be great if the church 
 
     was immune from this culture, but it isn’t. Even the Christian community tends to highlight our best people; from musicians to speakers, to those involved in doing incredible ministry. While I’m not saying that spotlighting is wrong, I am concerned 
 
     that there are many of us who become disheartened because we know our efforts don’t approach the skills or successes of those of the extremely gifted. I am concerned that some of us give up attempting to make a difference when we think we can’t 
 
     measure up.</p> 
 

 
     <p>True, we may never be celebrities in the eyes of the world or even within the Christian community. But, God doesn’t call us to be famous. He calls us to love one another. He calls us to give ourselves away to serve others. The needs of our world 
 
     are great, and we cannot do everything. Still, as part of the body of Christ, we have a unique and invaluable role to play. God has purposely designed us for accomplishing good works in His name.</p> 
 

 
     <p>Stop playing the comparison game. Anyone who plays that game loses. There will always be someone else who does things better or is more effective. We are called to serve the Lord. Our desire should be solely to please Him. Serve Him today to the 
 
     best of your abilities. Your service will be a sacrifice of praise to the King.</p> 
 

 
     <div id="daily-post-picture"> 
 
     <img src="https://placehold.it/100"> 
 
     </div> 
 

 
    </div> 
 
</div>